@charset "utf-8";

/* ========== 初期設定 ========== */
html {
	overflow-y: scroll;
	overflow-x: hidden;
}
@media screen and (min-width:1024px) {
	html {
		font-size: 62.5%;
	}
}

body {
	width: 100%;
	height: auto;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-style: normal;
	font-feature-settings: "palt";
	word-break: break-all;
	font-size: calc((100vw / 375) * 15);
	line-height: 1.8;
	letter-spacing: 0.1rem;
	color: #1c1c1c;
	background: #f1f5f6;
	overflow-x: hidden;
}
@media screen and (min-width:1024px) {
  body {
		font-size: 1.8rem;
    line-height: 1.8;
		min-width: 1440px;
  }
}

body, div, p, h1, h2, h3, h4, ul, figure {
	margin: 0;
	padding: 0;
}

h1,h2,h3,h4,h5,h6 {
	font-weight: 400;
	line-height: 1.5;
}

textarea,input[type="text"],input[type="tel"],input[type="email"],select,
textarea::placeholder,input[type="text"]::placeholder,
input[type="tel"]::placeholder,input[type="email"]::placeholder {
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: #1c1c1c;
}

img {
	border: 0;
	max-width: 100%;
	height: auto;
}

p {
	font-weight: 500;
	line-height: 2.0;
}

a {
	color: #1c1c1c;
	text-decoration: none;
	outline: none;
	transition: 0.7s;
	backface-visibility: hidden;
}
a.under-line {
	text-decoration: underline;	
}
@media screen and (min-width:1024px) {
	a {
		transition: all .6s ease;
	}
}

li {
	list-style-type: none;
}

table {
	width: 100%;
	text-align: left;
	border-collapse: collapse;
}

svg {
  overflow: visible;
}

/* レスポンシブ制御 */
.set-pc {
  display: none;
}
@media screen and (min-width:1024px) {
  .set-pc {
    display: block;
  }
}

.set-sp {
  display: block;
}
@media screen and (min-width:1024px) {
  .set-sp {
    display: none;
  }
}

/* クリアフィックス */
.clearfix:after {
  content: "";
  display: block;
  clear: both;
} 
.clearfix:before {
  content: "";
  display: block;
  clear: both;
} 
.clearfix {
  display: block;
}

/* コンテンツ幅 */
.container {
	position: relative;
	width: auto;
	max-width: 1800px;
	margin: 0 auto;
	padding-left: calc((100vw / 375) * 20);
	padding-right: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.container {
		padding-left: 40px;
		padding-right: 40px;
		min-width: 1360px;
	}
}
@media screen and (min-width: 1440px) {
	.container {
		padding-left: 60px;
		padding-right: 60px;
	}
}
@media screen and (min-width: 1600px) {
	.container {
		padding-left: 100px;
		padding-right: 100px;
	}
}

/* フォント設定 */
.en {
	font-family: "Cinzel", serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 400;
}

.exlight { font-weight: 200 !important; }
.light { font-weight: 300 !important; }
.medium { font-weight: 500 !important; }
.semiBold { font-weight: 600 !important; }
.bold {	font-weight: bold !important; }
.black { font-weight: 900 !important; }

.delay-fade {
	opacity:0;
	transition-duration:0.5s;
	transform:translateY(50px);
}
.delay-fade.d-active {
	opacity:1;
	transform:translateY(0);
}

/* ========== 共通部品 ========== */
/* ボタンデザイン */
.btn01 {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	text-align: center;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 60);
	padding-top: calc((100vw / 375) * 15);
	padding-bottom: calc((100vw / 375) * 15);
	white-space: nowrap;
	width: calc((100vw / 375) * 300);
	overflow: hidden;
	z-index: 1;
}
.btn01.style03 {
	background-color: #e8f0f1;
}
@media screen and (min-width:1024px) {
	.btn01 {
		font-size: 1.8rem;
		border-radius: 40px;
		padding-top: 24px;
		padding-bottom: 24px;
		width: 600px;
		transition: all .4s ease;
	}
	.btn01:hover {
		color: #fff;
	}
	.btn01.style02,
	.btn01.style03 {
		color: #1c1c1c;
	}
}

.btn01 .i-arrow {
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 8);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	background: url(./common_img/arrow_circle01.svg) center center / cover no-repeat;
}
.btn01.style02 .i-arrow {
	background: url(./common_img/arrow_circle02.svg) center center / cover no-repeat;
}
@media screen and (min-width:1024px) {
	.btn01 .i-arrow {
		right: 10px;
		width: 60px;
		height: 60px;
	}
}

@media screen and (min-width:1024px) {
	.btn01::before {
		content: '';
		display: block;
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translateY(-50%);
		width: 60px;
		height: 60px;
		border-radius: 50%;
		background-color: #7db6be;
		transition: all .4s ease;
		z-index: -1;
	}
	.btn01.style02::before {
		background-color: #e8f0f1;
	}
	.btn01:hover::before {
		transform: translateY(-50%) scale(22);
	}
}

.btn02 {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	text-align: center;
	color: #fff;
	background-color: #7db6be;
	border-radius: 30px;
	padding-top: calc((100vw / 375) * 15);
	padding-bottom: calc((100vw / 375) * 15);
	white-space: nowrap;
	width: calc((100vw / 375) * 200);
}
.btn02.style02 {
	background-color: #063c6d;
}
@media screen and (min-width:1024px) {
	.btn02 {
		font-size: 1.6rem;
		border-radius: 30px;
		padding-top: 14px;
		padding-bottom: 14px;
		width: 600px;
	}
	.btn02:hover {
		color: #7db6be;
		background-color: #fff;
	}
	.btn02.style02:hover {
		color: #063c6d;
		background-color: #fff;
	}
}

.btn02 .i-link {
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 22);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 15);
	height: calc((100vw / 375) * 15);
	background: url(./common_img/arrow_link.svg) center center / cover no-repeat;
}
@media screen and (min-width:1024px) {
	.btn02 .i-link {
		right: 33px;
		width: 20px;
		height: 20px;
	}
	.btn02:hover .i-link {
		filter: brightness(0) saturate(100%) invert(69%) sepia(40%) saturate(279%) hue-rotate(139deg) brightness(92%) contrast(89%);
	}
	.btn02.style02:hover .i-link {
		filter: brightness(0) saturate(100%) invert(9%) sepia(98%) saturate(5013%) hue-rotate(199deg) brightness(82%) contrast(95%);
	}
}

/* タイトル */
.lgtitle-en {
  font-size: calc((100vw / 375) * 72);
	white-space: nowrap;
	line-height: 0.8;
	color: #fff;
}
.title-en {
	font-size: calc((100vw / 375) * 22);
	white-space: nowrap;
	color: #7db6be;
}
.sec-title {
	font-size: calc((100vw / 375) * 18);
	font-weight: 400;
}
@media screen and (min-width:1024px) {
	.lgtitle-en {
		font-size: 22.0rem;
		letter-spacing: 1.0rem;
	}
	.title-en {
		font-size: 4.2rem;
	}
	.sec-title {
		font-size: 4.0rem;
	}
}

/* ========== ヘッダー ========== */
header {
	position: absolute;
	width: 100%;
	z-index: 100;
}

header .wrap {
	display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
	width: 100%;
  height: 100px;
}

header .headerLogo {
	padding-left: 100px;
	margin-top: 5px;
}

header .headerLogo img {
	width: auto;
}

header .header-nav {
	display: flex;
  flex-direction: column;
  gap: 12px;
	padding-right: 100px;
}

header .link-box {
	display: flex;
  flex-direction: row;
  gap: 50px;
	margin-left: 80px;
}

header .link-box a {
	font-size: 1.5rem;
	font-weight: bold;
}

header .gnav-open {
	position: fixed;
	top: 0;
	right: 0;
	background: url(./common_img/menu_open.png) center center / cover no-repeat;
	width: 100px;
	height: 100px;
	cursor: pointer;
}

/* ========== スマホメニュー ========== */
#spnav {
	position: absolute;
	width: 100%;
	z-index: 50;
}

#spnav .wrap {
	display: flex;
	justify-content: flex-end;
	flex-direction: row;
	align-items: center;
	height: calc((100vw / 375) * 40);
}

#spnav .header-logo {
	width: calc((100vw / 375) * 130);
  position: absolute;
	top: calc((100vw / 375) * 15);
	left: calc((100vw / 375) * 20);
}

#spnav .gnav-open {
	position: fixed;
	top: calc((100vw / 375) * 22);
	right: calc((100vw / 375) * 20);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 13);
}
#spnav .gnav-open::before {
	content: '';
	display: inline-block;
	position: fixed;
	background-image: url('./common_img/menu_open.png');
	background-size: cover;
	width: calc((100vw / 375) * 60);
	height: calc((100vw / 375) * 60);
	top: 0;
	right: 0;
}


/* ========== グローバルナビ ========== */
.g-nav {
	display: block;
	position: fixed;
	width: 100%;
	height: 0;
	background-color: #f1f5f6;
	opacity: .98;
	opacity: 0;
	visibility: hidden;
	animation-name: fadeout-anime;
	animation-fill-mode: forwards;
	animation-duration: 0.6s;
	animation-timing-function: ease;
	animation-direction: normal;     
	z-index: -1;
	transition: visibility .6s ease;
	overflow-y: auto;

}

.g-nav.is-open {
  animation-name: fadein-anime;
  animation-fill-mode: backwards;
  animation-duration: 0.6s;
  animation-timing-function: ease;
  animation-direction: normal;
  opacity: 0.98;
  z-index: 999;
  visibility: visible;
	height: 100vh;
}

.g-nav .gnav-close {
	position: absolute;
	top: 0;
	right: 0;
	background-image: url('./common_img/menu_close.png');
	background-size: cover;
	width: calc((100vw / 375) * 60);
	height: calc((100vw / 375) * 60);
	z-index: 100;
}
@media screen and (min-width: 1024px) {
	.g-nav .gnav-close {
		top: 0;
		right: 0;
		width: 100px;
		height: 100px;
		cursor: pointer;
		transition: opacity .6s ease;
	}
	.g-nav .gnav-close:hover {
		opacity: .7;
	}
}

.g-nav .container {
	height: inherit;
}

.g-nav .wrap {
	display: block;
	width: 100%;
	padding-top: calc((100vw / 375) * 45);
	margin: 0 auto;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-start;
	justify-content: space-between;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap {
		padding-top: 0;
		width: 100%;
		margin: 0 auto;
		flex-direction: row;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
}

.g-nav .wrap .visual {
	position: relative;
	width: 100%;
	height: calc((100vw / 375) * 330);
	background: url(./common_img/gnav_bg_sp.jpg) center center / cover no-repeat;
	margin-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .visual {
		width: 65%;
		height: 100vh;
		background: url(./common_img/gnav_bg.jpg) center bottom / cover no-repeat;
		margin-bottom: 0;
	}
}

.g-nav .wrap .visual .box {
	position: absolute;
	bottom: 0;
	left: calc((100vw / 375) * 20);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .visual .box {
		bottom: 60px;
		left: 20px;
		flex-direction: row;
		align-items: flex-end;
		gap: 60px;
	}
}
@media screen and (min-width: 1700px) {
	.g-nav .wrap .visual .box {
		left: 200px;
	}
}

.g-nav .wrap .visual .head {
	font-size: calc((100vw / 375) * 24);
	font-weight: 400;
	line-height: 1.6;
	color: #fff;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .visual .head {
		font-size: 5.2rem;

	}
}

.g-nav .wrap .visual .txt {
	color: #fff;
	white-space: nowrap;
	margin-bottom: 12px;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .visual .txt {
		margin-bottom: 12px;
	}
}

.g-nav .wrap .contents {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	padding: 0 calc((100vw / 375) * 20)
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents {
		justify-content: center;
		width: 52%;
		height: 100vh;
		padding: 0;
	}
}

.g-nav .wrap .contents .box {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .box {
		width: auto;
	}
}

.g-nav .wrap .contents .gnav-logo img {
	display: none;
	width: calc((100vw / 375) * 170);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .gnav-logo img {
		display: block;
		width: 256px;
	}
}

.g-nav .wrap .contents .main-nav {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav {
		width: 500px;
	}
}

.g-nav .wrap .contents .main-nav .list {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 25);
	margin-top: calc((100vw / 375) * 30);
	margin-bottom: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 50px 0;
		margin-top: 65px;
		margin-bottom: 95px;
	}
}

.g-nav .wrap .contents .main-nav .list li {
	width: auto;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list li {
		width: 50%;
	}
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(1) {order: 1;}
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(2) {order: 3;}
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(3) {order: 5;}
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(4) {order: 2;}
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(5) {order: 4;}
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(6) {order: 6;}
}

.g-nav .wrap .contents .main-nav .list li a {
	font-size: calc((100vw / 375) * 16);
	font-weight: bold;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list li a {
		font-size: 1.7rem;
	}
	.g-nav .wrap .contents .main-nav .list li a:hover {
		opacity: 0.7;
	}
}

.g-nav .wrap .contents .main-nav .sublist li .en {
	position: relative;
	font-size: calc((100vw / 375) * 16);
	text-align: center;
	color: #7db6be;
	margin: 0 auto;
	width: calc((100vw / 375) * 170);
}
.g-nav .wrap .contents .main-nav .sublist li .en::before {
	content: '';
	display: block;
    width: calc((100vw / 375) * 1);
    height: calc((100vw / 375) * 20);
	background-color: #7db6be;
	position: absolute;
	top: calc((100vw / 375) * 3);
	left: calc((100vw / 375) * -3);
	transform: rotate(-20deg);
}
.g-nav .wrap .contents .main-nav .sublist li .en::after {
	content: '';
	display: block;
  width: calc((100vw / 375) * 1);
  height: calc((100vw / 375) * 20);
	background-color: #7db6be;
	position: absolute;
	top: calc((100vw / 375) * 3);
	right: calc((100vw / 375) * -3);
	transform: rotate(20deg);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist li .en {
		font-size: 2.0rem;
		margin: 0 auto;
		width: 200px;
	}
	.g-nav .wrap .contents .main-nav .sublist li .en::before {
		width: 1px;
		height: 20px;
		top: 9px;
		left: -5px;
	}
	.g-nav .wrap .contents .main-nav .sublist li .en::after {
		width: 1px;
		height: 20px;
		top: 9px;
		right: -5px;
	}
}

.g-nav .wrap .contents .main-nav .sublist li .btn01 {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist li .btn01 {
		width: 500px;
	}
}

.g-nav .wrap .contents .main-nav .sublist li .btn02 {
	width: 100%;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist li .btn02 {
		width: 500px;
		margin-top: 20px;
	}
}

.g-nav .wrap .contents .sub-nav ul {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	gap: calc((100vw / 375) * 15);
	margin-top: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .sub-nav ul {
		gap: 18px;
		margin-top: 40px;
		margin-bottom: 0;
	}
}

.g-nav .wrap .contents .sub-nav ul li a {
	display: inline-block;
	filter: brightness(0) saturate(100%) invert(69%) sepia(40%) saturate(279%) hue-rotate(139deg) brightness(92%) contrast(89%);
  opacity: 0.6;
}

.g-nav .wrap .contents .sub-nav ul .i-facebook {	
	width: 24px;
	height: 24px;
	background: url(./common_img/icon_facebook.svg) center center / cover no-repeat;
}
.g-nav .wrap .contents .sub-nav ul .i-x {
	width: 21px;
	height: 21px;
	background: url(./common_img/icon_x.svg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .sub-nav ul .i-facebook {	
		width: 24px;
		height: 24px;
	}
	.g-nav .wrap .contents .sub-nav ul .i-x {
		width: 21px;
		height: 21px;
	}
}


/* ========== トップメインビジュアル ========== */
.top-mainvisual {
	position: relative;
	height: calc((100vw / 375) * 675);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual {
  	height: auto;
	}
}

.top-mainvisual .mv-bg {
	background: url(./images/mv_sp.jpg) center center / cover no-repeat;
	height: calc((100vw / 375) * 550);
	margin: calc((100vw / 375) * 65) calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 20);
	border-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
		.top-mainvisual .mv-bg {
		height: 880px;
		background: url(./images/mv.jpg) right bottom / cover no-repeat;
		margin: 100px 100px 0;
		border-radius: 250px;
	}
}

.top-mainvisual .box {
	position: absolute;
	top: calc((100vw / 375) * 20);
	left: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .box {
		top: 110px;
		left: 200px;
	}
}

.top-mainvisual .container {
	position: static;
}

.top-mainvisual .head {
	font-size: calc((100vw / 375) * 24);
	font-weight: 400;
  line-height: 1.5;
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .head {
		font-size: 8.6rem;
		margin-top: 0;
	}
}

.top-mainvisual .lgtxt {
	font-size: calc((100vw / 375) * 20);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.2rem;
	margin-top: calc((100vw / 375) * 16);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .lgtxt {
		font-size: 3.6rem;
		margin-top: 15px;
	}
}

.top-mainvisual .txt {
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	margin-top: calc((100vw / 375) * 20);
	width: calc((100vw / 375) * 300);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .txt {
		font-size: 1.8rem;
		margin-top: 30px;
		width: 745px;
	}
}

.top-mainvisual .head.d-active { transition-delay: 0.5s; }
.top-mainvisual .lgtxt.d-active { transition-delay: 0.7s; }
.top-mainvisual .txt.d-active { transition-delay: 0.9s; }

.top-mainvisual .scroll {
	position: relative;
	display: flex;
	justify-content: center;
	font-size: calc((100vw / 375) * 14);
	font-weight: 500;
	margin-bottom: calc((100vw / 375) * 14);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .scroll {
		font-size: 1.4rem;
		margin-top: 30px;
		margin-bottom: 145px;
	}
}

.top-mainvisual .scroll::before {
	content: '';
	display: block;
	width: 1px;
	height: calc((100vw / 375) * 50);
	background-color: #abb1b2;
	position: absolute;
	bottom: calc((100vw / 375) * -50);
	left: 50%;
	transform: translateX(-50%);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .scroll::before {
		width: 1px;
		height: 80px;
		bottom: -84px;
	}
}

/* ========== メインビジュアル：右下リンク ========== */
.mv-link {
	position: absolute;
	right: calc((100vw / 375) * 15);
	bottom: calc((100vw / 375) * 105);
	background: url(./images/mv_btn.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 125);
	height: calc((100vw / 375) * 126);
	transition: all .7s ease;
}
@media screen and (min-width: 1024px) {
	.mv-link {
		right: 100px;
		bottom: 55px;
		width: 180px;
		height: 179px;
	}
	.mv-link:hover a {
		opacity: .8;
	}
}

.mv-link a {
	position: relative;
	display: block;
	text-align: center;
	font-size: calc((100vw / 375) * 11);
	font-weight: 500;
	color: #fff;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;	
	width: calc((100vw / 375) * 104);
	height: calc((100vw / 375) * 109);
	margin-left: calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 14);
}
@media screen and (min-width: 1024px) {
	.mv-link a {
		font-size: 1.6rem;
		width: 160px;
		height: 160px;
		margin-top: 14px;
		margin-left: 20px;
	}
}

.mv-link.d-active { transition-delay: 1.2s; }

/* ========== 下層：メインビジュアル ========== */
.mainvisual {
	position: relative;
	height: calc((100vw / 375) * 675);
}
@media screen and (min-width: 1024px) {
	.mainvisual {
  	height: auto;
	}
}

.mainvisual .mv-bg {
	background: url(./images/mv_sp.jpg) center center / cover no-repeat;
	height: calc((100vw / 375) * 550);
	margin: calc((100vw / 375) * 65) calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 20);
	border-radius: calc((100vw / 375) * 60);
}
.mainvisual.is-contact .mv-bg {
	background: url(./contact/images/mv_sp.jpg) center center / cover no-repeat;
	margin-top: calc((100vw / 375) * 30);
}

@media screen and (min-width: 1024px) {
		.mainvisual .mv-bg {
		height: 880px;
		background: url(./images/mv.jpg) center bottom / cover no-repeat;
		margin: 100px 100px 0;
		border-radius: 250px;
	}
	.mainvisual.is-contact .mv-bg {
		background: url(./contact/images/mv.jpg) center center / cover no-repeat;
		margin-top: 100px;
	}
}

.mainvisual .box {
	position: absolute;
	top: calc((100vw / 375) * 20);
	left: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	.mainvisual .box {
		top: 280px;
		left: 200px;
	}
}

.mainvisual .container {
	position: static;
}

.mainvisual .head {
	font-size: calc((100vw / 375) * 24);
	font-weight: 400;
  line-height: 1.5;
	margin-top: calc((100vw / 375) * 130);
}
@media screen and (min-width: 1024px) {
	.mainvisual .head {
		font-size: 5.0rem;
		margin-top: 0;
	}
}

.mainvisual .h-title {
	font-size: calc((100vw / 375) * 20);
	color: #636871;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	.mainvisual .h-title {
		font-size: 2.0rem;
		margin-top: 20px;
	}
}

.mainvisual .txt {
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	margin-top: calc((100vw / 375) * 30);
	width: calc((100vw / 375) * 300);
}
@media screen and (min-width: 1024px) {
	.mainvisual .txt {
		font-size: 1.8rem;
		margin-top: 40px;
		width: 650px;
	}
}

.mainvisual .head.d-active { transition-delay: 0.5s; }
.mainvisual .h-title.d-active { transition-delay: 0.7s; }
.mainvisual .txt.d-active { transition-delay: 0.9s; }

.mainvisual .scroll {
	position: relative;
	display: flex;
	justify-content: center;
	font-size: calc((100vw / 375) * 14);
	font-weight: 500;
	margin-bottom: calc((100vw / 375) * 14);
}
@media screen and (min-width: 1024px) {
	.mainvisual .scroll {
		font-size: 1.4rem;
		margin-top: 30px;
		margin-bottom: 145px;
	}
}

.mainvisual .scroll::before {
	content: '';
	display: block;
	width: 1px;
	height: calc((100vw / 375) * 50);
	background-color: #abb1b2;
	position: absolute;
	bottom: calc((100vw / 375) * -50);
	left: 50%;
	transform: translateX(-50%);
}
@media screen and (min-width: 1024px) {
	.mainvisual .scroll::before {
		width: 1px;
		height: 80px;
		bottom: -84px;
	}
}

/* ========== メインエリア ========== */
main {
	background: #f1f5f6;
}

/* ========== パンくず ========== */
.footer-bc {
	background-color: #e4ebed;
}

.footer-bc ul {
	display: flex;
	flex-direction: row;
	padding: calc((100vw / 375) * 15) 0;
}
@media screen and (min-width:1024px) {
	.footer-bc ul {
		padding: 13px 0;
	}
}

.footer-bc ul li {
	position: relative;
	display: flex;
}

.footer-bc li + li {
  margin-left: calc((100vw / 375) * 25);
}
@media screen and (min-width: 1024px) {
	.footer-bc li + li {
		margin-left: 35px;
	}
}
.footer-bc li p,
.footer-bc li a {
	font-size: calc((100vw / 375) * 11);
	color: #757981;
}
.footer-bc li a {
	text-decoration: underline;
}
@media screen and (min-width: 1024px) {
	.footer-bc li p,
	.footer-bc li a {
		font-size: 1.3rem;
	}
	.footer-bc li a:hover {
		opacity: .7;
	}
}

.footer-bc li::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 52%;
	left: calc((100vw / 375) * -15);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 6);
	height: calc((100vw / 375) * 1);
	background-color: #6b6b6b;
}
.footer-bc li:first-of-type::before {
	display: none;
}

@media screen and (min-width:1024px) {
  .footer-bc li::before {
		top: 52%;
		left: -20px;
		width: 4px;
		height: 1px;
	}
}

/* ========== フッター ========== */
footer {
	position: relative;
	background-color: #002445;
	padding-top: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px)  {
	footer {
		padding-top: 170px;
	}
}

footer .footer-top {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
}
@media screen and (min-width:1024px)  {
	footer .footer-top {
		flex-direction: row;
		align-items: flex-end;
	}
}

footer .footer-main .logo {
	width: calc((100vw / 375) * 180);
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	footer .footer-main .logo {
		width: 350px;
		margin-top: 0;
	}
}

footer .footer-main .lgtxt {
	font-size: calc((100vw / 375) * 23);
	font-weight: 400;
	color: #fff;
	line-height: 1.6;
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	footer .footer-main .lgtxt {
		font-size: 4.0rem;
		margin-top: 60px;
	}
}

footer .footer-main .txt {
	font-size: calc((100vw / 375) * 16);
	color: #fff;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	footer .footer-main .txt {
		font-size: 1.4rem;
		width: 595px;
		margin-top: 30px;
	}
}

footer .footer-sub {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	footer .footer-sub  {
		width: 500px;
	}
}

footer .footer-sub .name {
	font-size: calc((100vw / 375) * 24);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.3rem;
	color: #fff;
	padding-bottom: calc((100vw / 375) * 25);
	padding-top: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .name {
		font-size: 4.0rem;
		padding-top: 0;
		padding-left: 55px;
		padding-bottom: 40px;
	}
}

footer .footer-sub .list {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 30);
	margin-bottom: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .list {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 25px 0;
		margin-top: 230px;
		margin-bottom: 95px;
	}
}

footer .footer-sub .list li {
	width: auto;
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .list li {
		width: 50%;
	}
	footer .footer-sub .list li:nth-of-type(1) {order: 1;}
	footer .footer-sub .list li:nth-of-type(2) {order: 3;}
	footer .footer-sub .list li:nth-of-type(3) {order: 5;}
	footer .footer-sub .list li:nth-of-type(4) {order: 2;}
	footer .footer-sub .list li:nth-of-type(5) {order: 4;}
	footer .footer-sub .list li:nth-of-type(6) {order: 6;}
}

footer .footer-sub .list li a {
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	color: #fff;
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .list li a {
		font-size: 1.7rem;
	}
	footer .footer-sub .list li a:hover {
		opacity: 0.7;
	}
}

footer .footer-sub .btnwrap li .en {
	position: relative;
	font-size: calc((100vw / 375) * 16);
	text-align: center;
	color: #fff;
	margin: 0 auto calc((100vw / 375) * 4);
	width: calc((100vw / 375) * 170);
}
footer .footer-sub .btnwrap li .en::before {
	content: '';
	display: block;
    width: calc((100vw / 375) * 1);
    height: calc((100vw / 375) * 20);
	background-color: #7db6be;
	position: absolute;
	top: calc((100vw / 375) * 3);
	left: calc((100vw / 375) * -3);
	transform: rotate(-20deg);
}
footer .footer-sub .btnwrap li .en::after {
	content: '';
	display: block;
  width: calc((100vw / 375) * 1);
  height: calc((100vw / 375) * 20);
	background-color: #7db6be;
	position: absolute;
	top: calc((100vw / 375) * 3);
	right: calc((100vw / 375) * -3);
	transform: rotate(20deg);
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .btnwrap li .en {
		font-size: 2.0rem;
		margin: 0 auto;
		width: 200px;
	}
	footer .footer-sub .btnwrap li .en::before {
		width: 1px;
		height: 20px;
		top: 9px;
		left: -5px;
	}
	footer .footer-sub .btnwrap li .en::after {
		width: 1px;
		height: 20px;
		top: 9px;
		right: -5px;
	}
}

footer .footer-sub .btnwrap li .btn01 {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .btnwrap li .btn01 {
		width: 500px;
	}
}

footer .footer-sub .btnwrap li .btn02 {
	width: 100%;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .btnwrap li .btn02 {
		width: 500px;
		margin-top: 20px;
	}
}

footer .footer-middle .sns-list {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	gap: calc((100vw / 375) * 15);
	margin-top: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 40);
	position: relative;
}
@media screen and (min-width: 1024px) {
	footer .footer-middle .sns-list {
		gap: 18px;
		margin: 60px 0 0 auto;
		width: 120px;
		padding-bottom: 200px;
	}
}

footer .footer-middle .sns-list li a {
	display: inline-block;
	opacity: .6;
}

footer .footer-middle .sns-list .i-facebook {	
	width: calc((100vw / 375) * 20);
	height: calc((100vw / 375) * 20);
	background: url(./common_img/icon_facebook.svg) center center / cover no-repeat;
}
footer .footer-middle .sns-list .i-x {
	width: calc((100vw / 375) * 18);
	height: calc((100vw / 375) * 18);
	background: url(./common_img/icon_x.svg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	footer .footer-middle .sns-list .i-facebook {	
		width: 24px;
		height: 24px;
	}
	footer .footer-middle .sns-list .i-x {
		width: 21px;
		height: 21px;
	}
}

footer .footer-copyright {
	font-size: calc((100vw / 375) * 9);
	color: #58697a;
	text-align: center;
	background-color: #001d38;
	line-height: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	footer .footer-copyright {
		font-size: 1.3rem;
		line-height: 60px;
	}
}

/* ========== index トップページ(#frontpage) ========== */
/* message */
#frontpage .message {
	position: relative;
	margin-top: calc((100vw / 375) * 30);
	margin-bottom: calc((100vw / 375) * 80);
}
@media screen and (min-width: 1024px) {
	#frontpage .message {
		margin-top: 0;
		margin-bottom: 195px;
	}
}

#frontpage .message .bg01 {
	background: url(./images/message_img01_sp.jpg) center top / cover no-repeat;
	width: calc((100vw / 375) * 308);
	height: calc((100vw / 375) * 226);
	position: absolute;
	top: 0;
	left: 0;
	border-top-right-radius: calc((100vw / 375) * 60);
  border-bottom-right-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#frontpage .message .bg01 {
		background: url(./images/message_img01.jpg) center top / cover no-repeat;
		width: 59%;
		height: 880px;
		top: 0;
		left: 0;
		margin-left: 100px;
		border-radius: 250px;
	}
}

#frontpage .message .bg02.d-active {
	transition-delay: 0.2s;
}
@media screen and (min-width: 1024px) {
	#frontpage .message .bg02 {
		background: url(./images/message_img02.jpg) center top / cover no-repeat;
		position: absolute;
		width: 31%;
		height: 580px;
		top: 0;
		right: 0;
		border-top-left-radius: 200px;
		border-bottom-left-radius: 200px;
	}
}

#frontpage .message .lgtitle-en {
	padding-top: calc((100vw / 375) * 156);
	text-align: right;
	position: relative;
	left: calc((100vw / 375) * -13);
}
@media screen and (min-width: 1024px) {
	#frontpage .message .lgtitle-en {
		padding-top: 665px;
		text-align: right;
		left: auto;
	}
}

#frontpage .message .box {
	margin-top: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	#frontpage .message .box {
		width: 800px;
		margin: 160px 0 0 auto;
	}
}

#frontpage .message .sec-title {
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .message .sec-title {
		margin-top: 10px;
	}
}

#frontpage .message .txt {
	font-weight: 500;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#frontpage .message .txt {
		font-weight: 500;
		margin-top: 40px;
		width: 712px;
	}
}

/* policy */
#frontpage .policy {
	background: url(./images/policy_bg_sp.jpg) center top / cover no-repeat;
	border-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy {
		background: url(./images/policy_bg.png) center top / cover no-repeat;
		height: 1519px;
		margin: 0 100px;
		border-radius: 250px;
	}
}

#frontpage .policy .lgtitle-en {
	position: absolute;
	bottom: calc((100vw / 375) * -11);
	right: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .lgtitle-en {
		bottom: 35px;
		right: 100px;
	}
}

#frontpage .policy .box-top {
	padding-bottom: calc((100vw / 375) * 70);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-top {
		height: 718px;
	}
}

#frontpage .policy .box-top .sec-title {
	font-size: calc((100vw / 375) * 21);
	color: #fff;
	text-align: center;
	padding-top: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-top .sec-title {
		font-size: 4.0rem;
		padding-top: 190px;
	}
}

#frontpage .policy .box-top .list {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-top .list {
		gap: 20px;
		flex-wrap: nowrap;
		margin-top: 40px;
	}
}

#frontpage .policy .box-top .list li {
	width: calc((100vw / 375) * 150);
	height: calc((100vw / 375) * 150);
	border: 1px solid #fff;
	border-radius: 50%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-top .list li {
		width: 220px;
		height: 220px;
	}
}

#frontpage .policy .box-top .list p {
	font-size: calc((100vw / 375) * 12);
	font-weight: 500;
	line-height: 1.8;
	color: #fff;
	text-align: center;
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-top .list p {
		font-size: 1.8rem;
	}
}

#frontpage .policy .box-top .list p .marker {
	font-weight: 600;
	background-color: #22304f;
	padding: 0 5px 1px;
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-top .list p .marker {
		padding: 0 5px 1px;
	}
}

#frontpage .policy .box-bottom {
	padding-left: calc((100vw / 375) * 20);
	padding-bottom: calc((100vw / 375) * 70);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-bottom {
		height: 801px;
		padding-left: 20px;		
	}
}
@media screen and (min-width: 1700px) {
	#frontpage .policy .box-bottom {
		padding-left: 100px;
	}
}

#frontpage .policy .box-bottom .sec-title {
	font-size: calc((100vw / 375) * 21);
	line-height: 1.8;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-bottom .sec-title {
		font-size: 4.0rem;
		padding-top: 210px;
	}
}

#frontpage .policy .box-bottom .txt {
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	line-height: 2.0;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#frontpage .policy .box-bottom .txt {
		font-size: 1.7rem;
		margin-top: 35px;
	}
}

/* menu */
#frontpage .menu {
	background-color: #043460;
	padding-top: calc((100vw / 375) * 75);
	padding-bottom: calc((100vw / 375) * 40);
	margin-top: calc((100vw / 375) * 80);
	border-top-right-radius: calc((100vw / 375) * 60);
	border-bottom-left-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .menu {
		padding-top: 190px;
		padding-bottom: 200px;
		margin-top: 310px;
		border-top-right-radius: 250px;
		border-bottom-left-radius: 250px;
	}
}

#frontpage .menu .lgtitle-en {
	text-align: center;
	color: #002d57;
}

#frontpage .menu .title-en {
	letter-spacing: 0.2rem;
	text-align: center;
	margin-top: calc((100vw / 375) * -71);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .title-en {
		letter-spacing: 0.5rem;
		margin-top: -118px;
	}
}

#frontpage .menu .sec-title {
	font-size: calc((100vw / 375) * 22);
	text-align: center;
	color: #fff;
	padding-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .sec-title {
		font-size: 4.0rem;
		padding-top: 15px;
	}
}

#frontpage .menu .lead {
	margin-top: calc((100vw / 375) * 15);
	color: #fff;
	text-align: center;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .lead {
		margin-top: 30px;
	}
}

#frontpage .menu .contents {
	padding-top: calc((100vw / 375) * 40);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .contents {
		padding-top: 100px;
	}
}

#frontpage .menu .box {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 20);
	background-color: #fff;
	border-radius: calc((100vw / 375) * 60);
	padding: calc((100vw / 375) * 40) calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box {
		flex-direction: row;
		gap: 95px;
		border-radius: 250px;
		padding: 100px;
	}
}

#frontpage .menu .box + .box {
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box + .box {
		margin-top: 80px;
	}
}

#frontpage .menu .box img {
	border-radius: calc((100vw / 375) * 50);
	width: 100%;
	height: calc((100vw / 375) * 210);
	object-fit: cover;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box img {
		border-radius: 200px;
		width: calc((100% - 95px) / 2);
		height: auto;
	}
}

#frontpage .menu .box .desc {
	width: auto;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box .desc {
		width: calc((100% - 95px) / 2);
	}
}

#frontpage .menu .box .desc .head {
	font-size: calc((100vw / 375) * 19);
	letter-spacing: 0.2rem;
	padding-bottom: calc((100vw / 375) * 15);
	border-bottom: 1px solid #d8e3e6;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box .desc .head {
		font-size: 3.4rem;
		padding-bottom: 30px;
	}
}

#frontpage .menu .box .desc .head span {
	display: block;
	font-size: calc((100vw / 375) * 22);
	font-weight: bold;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box .desc .head span {
		font-size: 3.8rem;
	}
}

#frontpage .menu .box .desc .txt {
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .box .desc .txt {
		margin-top: 30px;
	}
}

#frontpage .menu .area-bottom {
	display: flex;
	flex-direction: column;
	margin-top: calc((100vw / 375) * 30);
	justify-content: flex-start;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom {
		flex-direction: row;
		margin-top: 105px;
		justify-content: flex-start;
	}
}

#frontpage .menu .area-bottom .b-desc:nth-of-type(1) {
	border-bottom: 1px solid #305e89;
	padding-top: calc((100vw / 375) * 20);
	padding-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .b-desc:nth-of-type(1) {
		border-right: 1px solid #305e89;
		border-bottom: none;
		padding-top: 35px;
		padding-right: 150px;
		padding-bottom: 35px;
	}
}

#frontpage .menu .area-bottom .b-desc:nth-of-type(2) {
	padding-top: calc((100vw / 375) * 20);
	padding-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .b-desc:nth-of-type(2) {
		padding-top: 35px;
		padding-left: 150px;
		padding-bottom: 35px;
	}
}

#frontpage .menu .area-bottom .subtitle-en {
	font-size: calc((100vw / 375) * 19);
	color: #7db6be;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .subtitle-en {
		font-size: 2.2rem;
	}
}

#frontpage .menu .area-bottom .subtitle {
	font-size:  calc((100vw / 375) * 22);
	font-weight: 400;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .subtitle {
		font-size: 4.0rem;
		margin-bottom: 40px;
	}
}

#frontpage .menu .area-bottom .txt {
	color: #fff;
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .txt {
		max-width: 600px;
	}
}

#frontpage .menu .area-bottom .list {
	margin-top: calc((100vw / 375) * 15);
	margin-bottom: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .list {
		margin-top: 10px;
		margin-bottom: 10px;
	}
}

#frontpage .menu .area-bottom .list li {
	position: relative;
	color: #fff;
	padding-left: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .list li {
		padding-left: 18px;
	}
}

#frontpage .menu .area-bottom .list li + li {
	margin-top: calc((100vw / 375) * 4);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .list li + li {
		margin-top: 3px;
	}
}

#frontpage .menu .area-bottom .list li::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	border-radius: 50%;
	background-color: #7db6be;
	position: absolute;
	top: calc((100vw / 375) * 12);
	left: calc((100vw / 375) * 2);
}
@media screen and (min-width:1024px) {
	#frontpage .menu .area-bottom .list li::before {
		width: 8px;
		height: 8px;
		top: 15px;
		left: 2px;
	}
}

/* features */
#frontpage .features {
	background-color: #043460;
	padding-top: calc((100vw / 375) * 75);
	padding-bottom: calc((100vw / 375) * 80);
	margin-top: calc((100vw / 375) * 80);
	border-top-right-radius: calc((100vw / 375) * 60);
	border-bottom-left-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .features {
		padding-top: 190px;
		padding-bottom: 200px;
		margin-top: 310px;
		border-top-right-radius: 250px;
		border-bottom-left-radius: 250px;
	}
}

#frontpage .features .lgtitle-en {
	text-align: center;
	color: #002d57;
}

#frontpage .features .title-en {
	letter-spacing: 0.2rem;
	text-align: center;
	margin-top: calc((100vw / 375) * -71);
}
@media screen and (min-width:1024px) {
	#frontpage .features .title-en {
		letter-spacing: 0.5rem;
		margin-top: -118px;
	}
}

#frontpage .features .sec-title {
	font-size: calc((100vw / 375) * 22);
	text-align: center;
	color: #fff;
	padding-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .features .sec-title {
		font-size: 4.0rem;
		padding-top: 15px;
	}
}

#frontpage .features .contents {
	padding-top: calc((100vw / 375) * 40);
}
@media screen and (min-width:1024px) {
	#frontpage .features .contents {
		padding-top: 70px;
	}
}

#frontpage .features .box {
	position: relative;
}

#frontpage .features .box .box-bg {
	position: absolute;
	bottom: calc((100vw / 375) * 180);
	left: 0;
	border-top-right-radius: calc((100vw / 375) * 60);
	border-bottom-right-radius: calc((100vw / 375) * 60);
	width: calc((100vw / 375) * 350);
	height: calc((100vw / 375) * 350);
}
#frontpage .features .box:nth-of-type(1) .box-bg { background: url(./images/features_img01.jpg) center center / cover no-repeat; }
#frontpage .features .box:nth-of-type(2) .box-bg { 
	background: url(./images/features_img02.jpg) center center / cover no-repeat;
	right: 0;
	left: auto;
	margin-left: 0; 
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-top-left-radius: calc((100vw / 375) * 60);
	border-bottom-left-radius: calc((100vw / 375) * 60);
}
#frontpage .features .box:nth-of-type(3) .box-bg { background: url(./images/features_img03.jpg) center center / cover no-repeat; }
@media screen and (min-width:1024px) {
	#frontpage .features .box .box-bg {
		bottom: 120px;
		left: 0;
		border-radius: 250px;
		width: 65%;
		height: 800px;
		margin-left: 100px;
	}
	#frontpage .features .box:nth-of-type(2) .box-bg { right: 0; left: auto; margin-right: 100px; margin-left: 0; border-radius: 250px; }
}

#frontpage .features .box .desc {
	position: relative;
	padding: calc((100vw / 375) * 45) 0 0 calc((100vw / 375) * 20);
	margin: calc((100vw / 375) * 150) 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	z-index: 10;
}
#frontpage .features .box:nth-of-type(2) .desc {
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 20) 0 0;
	margin: calc((100vw / 375) * 300) auto 0 0;
}
#frontpage .features .box:nth-of-type(3) .desc {
	margin: calc((100vw / 375) * 300) auto 0 0;
}
@media screen and (min-width:1024px) {
	#frontpage .features .box .desc {
		align-items: flex-end;
		width: 680px;
		height: 700px;
		padding: 120px 0 0 150px;
		margin: 300px 0 0 auto;
	}
	#frontpage .features .box:nth-of-type(2) .desc {
		align-items: flex-start;
		padding: 120px 150px 0 0;
		margin: 300px auto 0 0;
	}
	#frontpage .features .box:nth-of-type(3) .desc {
		margin: 300px 0 0 auto;
	}
}

#frontpage .features .box .desc::before {
	content: '';
	display: block;
	background-color: #f1f5f6;
	width: calc((100vw / 375) * 500);
	height: calc((100vw / 375) * 440);
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	border-top-left-radius: calc((100vw / 375) * 60);
	border-bottom-left-radius: calc((100vw / 375) * 60);
}
#frontpage .features .box:nth-of-type(2) .desc::before {
	right: 0;
	left: auto;
	border-top-right-radius: calc((100vw / 375) * 60);
	border-bottom-right-radius: calc((100vw / 375) * 60);
	height: calc((100vw / 375) * 400);
}
#frontpage .features .box:nth-of-type(3) .desc::before {
  height: calc((100vw / 375) * 400);
}
@media screen and (min-width:1024px) {
	#frontpage .features .box .desc::before {
		width: 2000px;
		height: 700px;
		border-top-left-radius: 250px;
		border-bottom-left-radius: 250px;
	}
	#frontpage .features .box:nth-of-type(2) .desc::before {
		border-top-right-radius: 250px;
		border-bottom-right-radius: 250px;
		height: 700px;
	}
	#frontpage .features .box:nth-of-type(3) .desc::before {
		height: 700px;
	}
}

#frontpage .features .box .desc .num {
	width: calc((100vw / 375) * 80);
}
#frontpage .features .box:nth-of-type(2) .desc .num {
	margin-right: 0;
}
@media screen and (min-width:1024px) {
	#frontpage .features .box .desc .num {
		width: auto;
		margin-right: 300px;
	}
}

#frontpage .features .box .desc .head {
	font-size: calc((100vw / 375) * 19);
	letter-spacing: 0.2rem;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .features .box .desc .head {
		font-size: 3.4rem;
		margin-top: 40px;
	}
}


#frontpage .features .box .desc .head span {
	display: block;
	font-size: calc((100vw / 375) * 24);
	font-weight: bold;
}
@media screen and (min-width:1024px) {
	#frontpage .features .box .desc .head span {
		font-size: 3.8rem;
	}
}

#frontpage .features .box .desc .txt {
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .features .box .desc .txt {
		margin-top: 40px;
		width: 500px;
	}
}

#frontpage .features .btn01 {
	width: 100%;
	margin: calc((100vw / 375) * 90) auto 0;
}
@media screen and (min-width:1024px) {
	#frontpage .features .btn01 {
		margin: 60px auto 0;
		width: 600px;
	}
}


/* work */
#frontpage .work {
	margin-top: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .work {
		margin-top: 195px;
	}
}

#frontpage .work .title-en {
  margin-top: calc((100vw / 375) * -85);
}
@media screen and (min-width:1024px) {
	#frontpage .work .title-en {
		margin-top: -255px;
	}
}

#frontpage .work .sec-title {
  font-size: calc((100vw / 375) * 22);
}
@media screen and (min-width:1024px) {
	#frontpage .work .sec-title {
		font-size: 4.0rem;
		margin-top: 20px;
	}
}

#frontpage .work .list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
  gap: calc((100vw / 375) * 40);
	margin-top: calc((100vw / 375) * 35);
}
#frontpage .work .list.d-active {
	transition-delay: 0.3s;
}
@media screen and (min-width:1024px) {
	#frontpage .work .list {
		flex-direction: row;
		gap: 0;
		width: 1100px;
		margin: 0 0 0 auto;
	}
}
@media screen and (min-width:1500px) {
	#frontpage .work .list {
		margin: -194px 0 0 auto;
	}
}

#frontpage .work .list li {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding-right: calc((100vw / 375) * 40);
}
#frontpage .work .list li:nth-of-type(2) { padding-right: 0; padding-left: calc((100vw / 375) * 40);}
#frontpage .work .list li:nth-of-type(4) { padding-right: 0; padding-left: calc((100vw / 375) * 40); }
@media screen and (min-width:1024px) {
	#frontpage .work .list li {
		width: calc((100% - 9%) / 2);
		padding-right: 0;
	}
	#frontpage .work .list li:nth-of-type(2) { margin-top: 220px; padding: 0;}
	#frontpage .work .list li:nth-of-type(4) { margin-top: 140px; padding: 0;}
}

#frontpage .work .list img {
	border-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .work .list img {
		border-radius: 250px;
	}
}

#frontpage .work .list .head {
	font-size: calc((100vw / 375) * 20);
	font-weight: bold;
	text-align: center;
  line-height: 1.6;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .work .list .head {
		font-size: 2.8rem;
		margin-top: 20px;
	}
}

#frontpage .work .list .txt {
	line-height: 2.0;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .work .list .txt {
		margin-top: 15px;
		width: 400px;
	}
}

#frontpage .work .btn01 {
  margin: calc((100vw / 375) * 50) auto calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .work .btn01 {
		margin: 110px auto 140px;
	}
}

#frontpage .work .work-link {
	position: relative;
	display: block;
	width: 100%;
	background-color: #d4e1e4;
	border-radius: calc((100vw / 375) * 80);
	padding-top: calc((100vw / 375) * 10);
	padding-bottom: calc((100vw / 375) * 40);
	margin-top: calc((100vw / 375) * 50);
	z-index: 1;
	overflow: hidden;
}
@media screen and (min-width:1024px) {
	#frontpage .work .work-link {
		width: 100%;
		border-radius: 170px;
		padding-top: 0;
		padding-bottom: 0;
		margin-top: 130px;
	}
}

/* @media screen and (min-width:1024px) {
	#frontpage .work .work-link::before {
		content: '';
		display: block;
		position: absolute;
		top: 50%;
		right: 75px;
		transform: translateY(-50%);
		width: 60px;
		height: 60px;
		border-radius: 50%;
		background-color: #7db6be;
		transition: all .35s ease;
		z-index: -1;
	}
	#frontpage .work .work-link:hover::before {
		transform: translateY(-50%) scale(50);
	}
} */

#frontpage .work .work-link .desc {
	display: flex;
  flex-direction: column;
	justify-content: center;
	align-items: center;
}
@media screen and (min-width:1024px) {
	#frontpage .work .work-link .desc {
		flex-direction: row;
		justify-content: flex-start;
		height: 340px;
		padding-left: 100px;
	}
}

#frontpage .work .work-link .head {
	font-size: calc((100vw / 375) * 18);
	line-height: 1.8;
	border-bottom: 1px solid #fff;
  padding: calc((100vw / 375) * 20) 0 calc((100vw / 375) *10) 0;
	white-space: nowrap;
}
@media screen and (min-width:1024px) {
	#frontpage .work .work-link .head {
		font-size: 3.4rem;
		padding: 9px 74px 9px 0;
		border-bottom: none;
		border-right: 1px solid #fff;
		width: auto;
	}
}

#frontpage .work .work-link .txt {
	padding-top: calc((100vw / 375) * 25);
	padding-right: calc((100vw / 375) * 30);
	padding-left: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#frontpage .work .work-link .txt {
		width: 510px;
		padding-top: 0;
		padding-right: 0;
		padding-left: 65px;
	}
}
@media screen and (min-width:1700px) {
	#frontpage .work .work-link .txt {
		width: 675px;
	}
}

#frontpage .work .work-link .i-arrow {
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 20);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	background: url(./common_img/arrow_circle01.svg) center center / cover no-repeat;
}
@media screen and (min-width:1024px) {
	#frontpage .work .work-link .i-arrow {
		right: 75px;
		width: 60px;
		height: 60px;
	}
}

#frontpage .work .bg {
	background: url(./images/work_bg_sp.jpg) center center / cover no-repeat;
	width: 100%;
	height: calc((100vw / 375) * 250);
	margin-top: calc((100vw / 375) * 80);
	margin-bottom: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .work .bg {
		background: url(./images/work_bg.jpg) center center / cover no-repeat;
		height: 980px;
		margin-top: 200px;
		margin-bottom: 200px;
	}
}

/* ceo */
#frontpage .ceo {
	position: relative;
	padding-bottom: calc((100vw / 375) * 70);
}
@media screen and (min-width:1024px) {
	#frontpage .ceo {
		padding-bottom: 200px;
	}
}

#frontpage .ceo .img {
	position: absolute;
	background: url(./images/ceo_img01.jpg) center center / cover no-repeat;
	width: calc((100vw / 375) * 250);
	height: calc((100vw / 375) * 230);
	top: calc((100vw / 375) * 75);
	right: calc((100vw / 375) * 20);
	border-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .ceo .img {
		width: 800px;
		height: 800px;
		top: 120px;
		right: 0;
		border-radius: 250px;
		margin-right: 100px;
	}
}
@media screen and (min-width:1700px) {
	#frontpage .ceo .img {
		top: 0;
	}
}

#frontpage .ceo .lgtitle-en {
	position: relative;
}

#frontpage .ceo .title-en {
	position: relative;
	margin-top: calc((100vw / 375) * 160);
}
@media screen and (min-width:1024px) {
	#frontpage .ceo .title-en {
		margin-top: 60px;
	}
}

#frontpage .ceo .sec-title {
	position: relative;
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#frontpage .ceo .sec-title {
		margin-top: 25px;
	}
}

#frontpage .ceo .txt {
	position: relative;
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#frontpage .ceo .txt {
		margin-top: 40px;
	}
}

/* information */
#frontpage .information {
	padding-top: calc((100vw / 375) * 60);
	padding-bottom: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#frontpage .information {
		padding-top: 270px;
		padding-bottom: 200px;
	}
}

#frontpage .information .titlebox {
  margin-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#frontpage .information .titlebox {
		position: absolute;
		top: -70px;
		margin-bottom: 0;
	}
}

#frontpage .information .title-en {
	line-height: 1.2;
	margin-top: calc((100vw / 375) * -28);
	position: relative;
	z-index: 10;
}
@media screen and (min-width:1024px) {
	#frontpage .information .title-en {
		margin-top: -72px;
	}
}

#frontpage .information .box {
	background-color: #fff;
	border-radius: calc((100vw / 375) * 60);
	width: 100%;
	padding: calc((100vw / 375) * 20);
	margin: 0 0 0 auto;
	z-index: 1;
	position: relative;
}
@media screen and (min-width: 1024px) {
	#frontpage .information .box {
		border-radius: 250px;
		width: 1200px;
		padding: 50px 100px 100px 100px;
		right: -100px;
	}
}

#frontpage .information .list {
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	#frontpage .information .list {
		margin-bottom: 10px;
	}
}

#frontpage .information .list article + article {
	border-top: 1px solid #d8e3e6;
}

#frontpage .information .list article a {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	padding-top: calc((100vw / 375) * 20);
	padding-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .information .list article a {
		flex-direction: row;
		padding-top: 50px;
		padding-bottom: 50px;
	}
	#frontpage .information .list article a:hover {
		opacity: .7;
	}
}

#frontpage .information .list img {
	border-radius: calc((100vw / 375) * 40);	
}
@media screen and (min-width:1024px) {
	#frontpage .information .list img {
		border-radius: 110px;	
	}
}

#frontpage .information .list .txtarea {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#frontpage .information .list .txtarea {
		width: auto;
		margin-left: 50px;
	}
}

#frontpage .information .list .t-top {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#frontpage .information .list .t-top {
		margin-top: 55px;
	}
}

#frontpage .information .list .date {
	color: #7db6be;
	line-height: calc((100vw / 375) * 20);
	padding-right: calc((100vw / 375) * 10);
	border-right: 1px solid #7db6be;
}
@media screen and (min-width:1024px) {
	#frontpage .information .list .date {
		line-height: 20px;
		padding-right: 12px;
	}
}

#frontpage .information .list .cat {
	color: #7db6be;
	line-height: calc((100vw / 375) * 20);
	padding-left: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	#frontpage .information .list .cat {
		line-height: 20px;
		padding-left: 12px;
	}
}

#frontpage .information .list .title {
	font-size: calc((100vw / 375) * 18);
	font-weight: 600;
	margin-top: calc((100vw / 375) * 15);
	display: -webkit-box;             
  -webkit-box-orient: vertical;  
	overflow: hidden;
  text-overflow: ellipsis;
	-webkit-line-clamp: 2;
}
@media screen and (min-width:1024px) {
	#frontpage .information .list .title {
		font-size: 2.0rem;
		margin-top: 14px;
	}
}

#frontpage .information .list .txt {
	font-size: calc((100vw / 375) * 15);
	color: #8e9197;
	overflow: hidden;   
  text-overflow: ellipsis;
  white-space: nowrap;
	margin-top: calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#frontpage .information .list .txt {
		font-size: 1.5rem;
		margin-top: 10px;
	}
}

#frontpage .information .box .btn01 {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0;
  margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	#frontpage .information .box .btn01 {
		font-size: 1.8rem;
		letter-spacing: 0.1rem;
	}
}

/* ========== index CTA(cta-contact) ========== */
.cta-contact {
	position: relative;
	overflow: hidden;
}
#frontpage .cta-contact {
	margin-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width:1024px) {
	.cta-contact {
		padding-top: 100px;
	}
	#frontpage .cta-contact {
		margin-bottom: 200px;
	}
}

.cta-contact::before {
	content: '';
	display: block;
	background-color: #8f1111;
	position: absolute;
	width: 100%;
	height: calc((100vw / 375) * 490);
	bottom: 0;
}
@media screen and (min-width:1024px) {
	.cta-contact::before {
		height: 550px;
	}
}

.cta-contact .lgtitle-en {
	position: absolute;
	bottom: calc((100vw / 375) * -12);
	left: 50%;
	color: #790202;
	transform: translateX(-50%);
}
@media screen and (min-width:1024px) {
	.cta-contact .lgtitle-en {
		bottom: -30px;
	}
}

.cta-contact .box {
	display: flex;
  flex-direction: column-reverse;
	justify-content: space-between;
	align-items: flex-start;
	padding-bottom: calc((100vw / 375) * 77);
}
@media screen and (min-width:1024px) {
	.cta-contact .box {
		flex-direction: row;
		padding-bottom: 50px;
	}
}

.cta-contact .box .desc {
  flex: 0 0 auto;
}
@media screen and (min-width:1024px) {
	.cta-contact .box .desc {
		width: 290px;
		flex: 0 0 auto;
	}
}
@media screen and (min-width:1500px) {
	.cta-contact .box .desc {
		width: 342px;
	}
}

.cta-contact .box .desc .sec-title {
	line-height: 1.8;
	color: #fff;
	padding-top: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .desc .sec-title {
		padding-top: 100px;
	}
}

.cta-contact .box .desc .txt {
	color: #fff;	
	padding-top: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .desc .txt {
		padding-top: 20px;
	}
}

.cta-contact .box .link-area {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	height: calc((100vw / 375) * 400);
	padding-left: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area {
		flex-direction: row;
		height: 500px;
		top: -100px;
		padding-left: 70px;
	}
}
@media screen and (min-width:1750px) {
	.cta-contact .box .link-area {
		padding-left: 178px;
	}
}

.cta-contact .box .link-area::before {
	content: '';
	display: block;
	background-color: #043460;
	border-top-left-radius: calc((100vw / 375) * 100);
	border-bottom-left-radius: calc((100vw / 375) * 100);
	position: absolute;
	top: 0;
	left: 0;
	width: calc((100vw / 375) * 400);
	height: calc((100vw / 375) * 400);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area::before {
		border-top-left-radius: 250px;
		border-bottom-left-radius: 250px;
		width: 2000px;
		height: 500px;
	}
}

.cta-contact .box .link-area .tel {
	position: relative;
	border-bottom: 1px solid #002445;
	padding: calc((100vw / 375) * 35) 0 calc((100vw / 375) * 25) 0
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .tel {
		padding: 14px 20px 22px 0;
		width: 470px;
		border-right: 1px solid #002445;
		border-bottom: none;
	}
}
@media screen and (min-width:1750px) {
	.cta-contact .box .link-area .tel {
		padding: 14px 65px 22px 0;
		width: 563px;
	}
}

.cta-contact .box .link-area .tel .head {
	font-size: calc((100vw / 375) * 21);
	font-weight: 500;
	text-align: center;
	color: #fff;
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .tel .head {
		font-size: 3.0rem;
	}
}

.cta-contact .box .link-area .tel .en {
	font-size: calc((100vw / 375) * 38);
	font-weight: 400;
	line-height: 1;
	text-align: center;
	color: #fff;
	margin-top: 10px;
	white-space: nowrap;
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .tel .en {
		font-size: 6.6rem;
		margin-top: 10px;
	}
}
@media screen and (min-width:1750px) {
	.cta-contact .box .link-area .tel .en {
		font-size: 7.6rem;
	}
}

.cta-contact .box .link-area .tel .time {
	font-size: calc((100vw / 375) * 11);
	display: block;
	font-weight: 500;
	color: #fff;
	text-align: center;
	background-color: #002445;
	padding: 0 calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .tel .time {
		font-size: 1.8rem;
		padding: 0;
		margin-top: 10px;
	}
}

.cta-contact .box .link-area .mail {
	position: relative;
	padding-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .mail {
		padding-top: 0;
		padding-left: 20px;
	}
}
@media screen and (min-width:1750px) {
	.cta-contact .box .link-area .mail {
		padding-left: 60px;
	}
}

.cta-contact .box .link-area .mail .head {
	font-size: calc((100vw / 375) * 21);
	font-weight: 500;
	text-align: center;
	color: #fff;
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .mail .head {
		font-size: 3.0rem;
	}
}

.cta-contact .box .link-area .mail .btn01 {
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .mail .btn01 {
		width: 500px;
		margin-top: 20px;
	}
}

.cta-contact .box .link-area .mail .txt {
	font-size: calc((100vw / 375) * 12);
	color: #fff;
	text-align: center;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	.cta-contact .box .link-area .mail .txt {
		font-size: 1.5rem;
		margin-top: 5px;
	}
}


/* ========== index CONTACT(#contact) ========== */
#contact {
	background-color: #f1f6f6;
}

#contact .contact-form .inner {
	position: relative;
	padding-bottom: calc((100vw / 375) * 20);
	z-index: 10;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .inner {
		padding-bottom: 200px;
		max-width: 1400px;
		width: auto;
		margin: 0 auto;
	}
}

#contact .contact-form .step {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: calc((100vw / 375) * 18);
	border-radius: calc((100vw / 375) * 60);
	background-color: #dfeaeb;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step {
    margin-bottom: 100px;
		border-radius: 60px;
	}
}

#contact .contact-form .step li {
	position: relative;
	padding-top: calc((100vw / 375) * 10);
	padding-bottom: calc((100vw / 375) * 10);
	width: 33.3%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	z-index: 10;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step li {
		padding-top: 20px;
		padding-bottom: 27px;
		width: 33.3%;
	}
}

#contact .contact-form .step li.is-active {
	background-color: #7db6be;
	border-radius: calc((100vw / 375) * 60);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step li.is-active {
		border-radius: 60px;
	}
}

#contact .contact-form .step li p {
	text-align: center;
	color: #141517;
	font-weight: 400;
}
#contact .contact-form .step li.is-active p {
	color: #fff;
}
#contact .contact-form .step li p:nth-of-type(1) {
	display: inline-block;
	font-size: calc((100vw / 375) * 15);
	line-height: 1.2;
	color: #7db6be;
}
#contact .contact-form .step li.is-active p:nth-of-type(1) {
	color: #fff;
}
#contact .contact-form .step li p:nth-of-type(1) .num {
	display: inline-block;
	position: relative;
	font-size: calc((100vw / 375) * 22);
	padding-left: calc((100vw / 375) * 2);
	top: calc((100vw / 375) * 1);
}
#contact .contact-form .step li p:nth-of-type(2) {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.05rem;
	line-height: 1.2;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step li p:nth-of-type(1) {
		font-size: 1.8rem;
	}
	#contact .contact-form .step li p:nth-of-type(1) .num {
		font-size: 3.4rem;
		padding-left: 5px;
		top: 5px;
	}
	#contact .contact-form .step li p:nth-of-type(2) {
		font-size: 1.8rem;
		line-height: 1.8;
	}
}

#contact .contact-form .contact-main .main-wrap h2 {
	font-size: calc((100vw / 375) * 19);
	font-weight: 400;
	padding-bottom: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-main .main-wrap h2 {
		font-size: 2.8rem;
		padding-bottom: 10px;
	}
}

#contact .contact-form li {
	list-style: none;
}

#contact .contact-form .contact-main .lead {
	font-size: calc((100vw / 375) * 15);
	margin-bottom: calc((100vw / 375) * 20);
	color: #141517;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-main .lead {
		font-size: 1.8rem;
		text-align: center;
		padding-left: 0;
		margin-bottom: 25px;
	}
}

#contact .contact-form .contact-main .sublead {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	margin-bottom: calc((100vw / 375) * 20);
	color: #141517;
}
#contact .contact-form .contact-main .sublead .icon {
	display: inline-block;
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	background-color: #7db6be;
	border-radius: 50%;
	margin-right: calc((100vw / 375) * 4);
	position: relative;
	top: calc((100vw / 375) * -1);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-main .sublead {
		font-size: 1.8rem;
		text-align: center;
		padding-left: 0;
		margin-bottom: 90px;
	}
	#contact .contact-form .contact-main .sublead .icon {
		width: 10px;
		height: 10px;
		margin-right: 5px;
		top: -1px;
	}
}

#contact .contact-form .contact-sub {
	background-color: #f1f5f6;
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 10px;
}
#contact .contact-form .contact-sub p {
	font-size: 1.2rem;
	line-height: 1.6;
	letter-spacing: 0;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-sub {
		border-radius: 20px;
		padding: 50px;
	}
	#contact .contact-form .contact-sub p {
		font-size: 1.6rem;
		line-height: 1.8;
		letter-spacing: 1px;
	}
}

#contact .contact-form .form-bg {
	background-color: #fff;
	border-radius: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-bg {
		border-radius: 60px;
	}
}

#contact .contact-form .form-table {
	display: block;
	width: 100%;
	border-collapse: collapse;
	padding: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table {
		padding: 90px 100px 0;		
	}
}

#contact .contact-form .form-table tr {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
#contact .contact-form .form-table tr.no-bottom {
	border-bottom: none;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table tr {
		flex-direction: row;
	}
}

#contact .contact-form .form-table th,
#contact .contact-form .form-table td {
	vertical-align: top;
	text-align: left;
	box-sizing: border-box;
}

#contact .contact-form .form-table th {
	position: relative;
	display: block;
	color: #141517;
	font-size: calc((100vw / 375) * 16);
	font-weight: 500;
	letter-spacing: 1px;
	padding: calc((100vw / 375) * 18) 0 calc((100vw / 375) * 5) calc((100vw / 375) * 5);
	border-bottom: 2px solid #7db6be;
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th {
		font-size: 1.6rem;
		display: table-cell;
		padding: 35px 20px 30px 46px;
		width: 300px;
	}
	#contact .contact-form .form-table tr.no-bottom th,
	#contact .contact-form .form-table tr.no-bottom th.must,
	#contact .contact-form .form-table tr.no-bottom td,
	#contact .contact-form .form-table tr.no-bottom td.must {
		padding-bottom: 0;
	}
}

#contact .contact-form .form-table td {
	display: block;
	border-bottom: none;
	padding: calc((100vw / 375) * 15) calc((100vw / 375) * 5);
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table td {
		display: table-cell;
		padding: 20px 50px;
		width: calc(100% - 300px);
	}
}

#contact .contact-form .form-table td > p {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	letter-spacing: 0;
	color: #464646;
	padding-top: 8px;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table td > p {
		font-size: 1.6rem;
		font-weight: 500;
		padding-top: 16px;
	}
}

#contact .contact-form .form-table th.must::before {
	content: '';
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	background-color: #7db6be;
	border-radius: 50%;
	position: absolute;
	top: calc((100vw / 375) * 29);
	left: calc((100vw / 375) * -12);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th.must::before {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		top: 45px;
		left: 8px;
	}
}

#contact .contact-form .form-table th .sub-text,
#contact .contact-form .form-table td .sub-text {
	font-size: calc((100vw / 375) * 11);
	font-weight: 500;
	padding-top: calc((100vw / 375) * 10);
}
#contact .contact-form .form-table th.must .sub-text {
	margin-left: calc((100vw / 375) * -44);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th .sub-text,
	#contact .contact-form .form-table td .sub-text,
	#contact .contact-form .form-table th.must .sub-text {
		font-size: 1.2rem;
		padding-top: 8px;
		margin-left: 0;
	}
}

#contact .contact-form .form-table th .sub-text-lg,
#contact .contact-form .form-table td .sub-text-lg {
	font-size: calc((100vw / 375) * 12);
	font-weight: 500;
	padding-top: calc((100vw / 375) * 6);
}
#contact .contact-form .form-table th.must .sub-text-lg {
	margin-left: calc((100vw / 375) * -44);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th .sub-text-lg,
	#contact .contact-form .form-table th.must .sub-text-lg,
	#contact .contact-form .form-table td .sub-text-lg {
		font-size: 16px;
		padding-top: 10px;
		margin-left: 0;
	}
}

#contact .contact-form .form-table th .sub-text-lg + .sub-text {
	padding-top: calc((100vw / 375) * 3);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th .sub-text-lg + .sub-text {
		padding-top: 6px;
	}
}

#contact .contact-form .checkbox {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox {
		gap: 20px 60px;
		margin-top: 12px;
	}
}

#contact .contact-form .checkbox li {
	width: 100%;
}
#contact .contact-form .checkbox.ch-kakunin li {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox li,
	#contact .contact-form .checkbox.ch-kakunin li {
		width: 310px;
	}
}

#contact .contact-form .checkbox .checkbox-input input {
	display: none;
}

#contact .contact-form .checkbox .checkbox-input .checkbox-text {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	color: #141517;
	padding: calc((100vw / 375) * 10) 0 calc((100vw / 375) * 10) calc((100vw / 375) * 38);
	line-height: calc((100vw / 375) * 30);
	display: block;
	border-radius: calc((100vw / 375) * 8);
	transition-duration: 0.3s;
}
#contact .contact-form .checkbox.ch-kakunin .checkbox-input .checkbox-text {
	padding-left: calc((100vw / 375) * 23);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox .checkbox-input .checkbox-text {
		font-size: 1.6rem;
		padding: 0 20px 0 52px;
		line-height: 40px;
		border-radius: 10px;
	}
	#contact .contact-form .checkbox.ch-kakunin .checkbox-input .checkbox-text {
		padding-left: 40px;
	}
}

#contact .contact-form .checkbox .checkbox-input .checkbox-text::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	width: calc((100vw / 375) * 28);
	height: calc((100vw / 375) * 28);
	background-color: #f1f5f6;
	border: 1px solid #ddd;
	border-radius: calc((100vw / 375) * 6);
	transform: translateY(-50%);
	transition: all .3s ease;
}
#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text::before {
	background-color: #7db6be;
	border: 1px solid #7db6be;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox .checkbox-input .checkbox-text::before {
		left: 0;
		width: 40px;
		height: 40px;
		border-radius: 5px;
	}
}

#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text::after {
	content: "";
	display: block;
	position: absolute;
	top: 46%;
	left: calc((100vw / 375) * 10);
	width: calc((100vw / 375) * 9);
	height: calc((100vw / 375) * 12);
	transform: translateY(-50%) rotate(40deg);
	border-bottom: calc((100vw / 375) * 2) solid #fff;
	border-right: calc((100vw / 375) * 2) solid #fff;
	transition: all .3s ease;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text::after {
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
		width: 10px;
		height: 14px;
		top: 45%;
		left: 15px;
	}
}

#contact .contact-form form#mailformpro .checkbox .checkbox-input {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form form#mailformpro .checkbox .checkbox-input  {
		width: auto;
	}
}

#contact .contact-form .radiobox {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 0 calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .radiobox {
		flex-wrap: nowrap;
		flex-direction: row;
		gap: 32px;
	}
}

#contact .contact-form .radiobox li {
	width: calc((100% - calc((100vw / 375) * 10)) / 2);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .radiobox li {
		width: auto;
	}
}

#contact .contact-form .radiobox-input input {
	display: none;
}

#contact .contact-form .radiobox-input .radiobox-text {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	color: #141517;
	line-height: calc((100vw / 375) * 35);
	padding: calc((100vw / 375) * 10) 0 calc((100vw / 375) * 10) calc((100vw / 375) * 35);
	display: block;
	transition-duration: 0.3s;

}
@media screen and (min-width: 1024px) {
	#contact .contact-form .radiobox-input .radiobox-text {
		font-size: 1.6rem;
		padding: 0 25px 0 42px;
		line-height: 58px;
	}
}

#contact .contact-form .radiobox-input .radiobox-text::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	width: calc((100vw / 375) * 30);
	height: calc((100vw / 375) * 30);
	background-color: #f1f5f6;
	border: 1px solid #ddd;
	border-radius: 50%;
	transform: translateY(-50%);
}
#contact .contact-form .radiobox-input.mfp_checked .radiobox-text::before {
	background-color: #7db6be;
	border: 1px solid #7db6be;
}
#contact .contact-form .radiobox-input.mfp_checked .radiobox-text::after {
	content: "";
	display: block;
	position: absolute;
	top: calc((100vw / 375) * 21.5);
	left: calc((100vw / 375) * 9);
	width: calc((100vw / 375) * 12);
	height: calc((100vw / 375) * 12);
	background-color: #fff;
	border-radius: 50%;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .radiobox-input .radiobox-text::before {
		top: 50%;
		left: 0;
		width: 30px;
		height: 30px;
	}
	#contact .contact-form .radiobox-input.mfp_checked .radiobox-text::after {
		top: 24px;
		left: 10px;
		width: 10px;
		height: 10px;
	}
}

#contact .contact-form form#mailformpro .radiobox-input {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form form#mailformpro .radiobox-input  {
		width: auto;
	}
}

#contact .contact-form .select-flex {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
  gap: calc((100vw / 375) * 10) calc((100vw / 375) * 15);
  flex-wrap: wrap;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .select-flex {
		gap: 20px;
		flex-wrap: nowrap;
	}
}

#contact .contact-form .selectbox {
	position: relative;
	width: calc((100vw / 375) * 180);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .selectbox {
		width: 250px;
	}
}

#contact .contact-form .selectbox:after {
	content: '';
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 12);
	width: calc((100vw / 375) * 13);
	height: calc((100vw / 375) * 6);
	background: url(./common_img/arrow_down.svg) center center / cover no-repeat;
	transform: translateY(-50%);
	z-index: 10;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .selectbox:after {
		top: 52%;
		right: 20px;
		width: 16px;
		height: 10px;
	}
}

#contact .contact-form .address-wrap {
	position: relative;
	padding-bottom: 0;
}
#contact .contact-form .address-wrap .address-icon {
	position: absolute;
	top: calc((100vw / 375) * 12);
	left: calc((100vw / 375) * 4);
}
#contact .contact-form .address-wrap .address-input {
	width: calc((100vw / 375) * 120) !important;
  margin-left: calc((100vw / 375) * 25);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .address-wrap {
		padding-bottom: 20px;
	}
	#contact .contact-form .address-wrap .address-icon {
		top: 20px;
		left: -30px;
	}
	#contact .contact-form .address-wrap .address-input {
		width: 180px !important;
		margin-left: 0;
	}
}

#contact .contact-form .selectbox-wrap {
	position: relative;
}

#contact .contact-form .selectbox-wrap::after {
	content: "";
	display: block;
	position: absolute;
	top: calc((100vw / 375) * 28);
	right: calc((100vw / 375) * 15);
	width: calc((100vw / 375) * 10);
	height: calc((100vw / 375) * 10);
	transform: rotate(45deg);
	border-bottom: calc((100vw / 375) * 1) solid #141517;
	border-right: calc((100vw / 375) * 1) solid #141517;
}
@media screen and (min-width: 1280px) {
	#contact .contact-form .selectbox-wrap::after {
    border-bottom: 2px solid #141517;
    border-right: 2px solid #141517;
    width: 15px;
    height: 15px;
    top: 37px;
    right: 76px;
	}
}


#contact .contact-form textarea,
#contact .contact-form input[type="text"],
#contact .contact-form input[type="tel"],
#contact .contact-form input[type="email"],
#contact .contact-form select {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight: 500;
	font-size: calc((100vw / 375) * 15);
	color: #141517;
	border: none;
	border-radius: 0;
	background: #f1f5f6;
	width: 100% !important;
	box-sizing: border-box;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	border: 1px #ddd solid;
}
@media screen and (min-width:1024px) {
	#contact .contact-form input[type="text"],
	#contact .contact-form input[type="tel"],
	#contact .contact-form input[type="email"],
	#contact .contact-form select {
		font-size: 1.6rem;
	}
	#contact .contact-form textarea {
		font-size: 1.6rem;
	}
}

#contact .contact-form input[type="text"],
#contact .contact-form input[type="tel"],
#contact .contact-form input[type="email"],
#contact .contact-form select {
	line-height: calc((100vw / 375) * 45);
	height: calc((100vw / 375) * 45);
	padding: 0 calc((100vw / 375) * 15);
	background-color: #f1f5f6;
	border-radius: calc((100vw / 375) * 8);
	border: 1px solid #c8cccd;
	margin-bottom: calc((100vw / 375) * 8);
}
@media screen and (min-width:1024px) {
	#contact .contact-form input[type="text"],
	#contact .contact-form input[type="tel"],
	#contact .contact-form input[type="email"],
	#contact .contact-form select {
		line-height: 60px;
		height: 60px;
		padding: 0 20px;
		margin-bottom: 0;
		border-radius: 5px;
	}
}

#contact .contact-form input[type="text"] + p,
#contact .contact-form input[type="tel"] + p,
#contact .contact-form input[type="email"] + p {
	height: 68px;
	padding-top: 16px;
}

#contact .contact-form textarea {
	height: calc((100vw / 375) * 120) !important;
	padding: 12px;
	background-color: #f1f5f6;
	border: 1px solid #ddd;
	border-radius: calc((100vw / 375) * 8);
}
#contact .contact-form textarea.textarea-small {
	height: 80px !important;
}
@media screen and (min-width:1024px) {
	#contact .contact-form textarea {
		height: 260px !important;
		padding: 15px 20px;
		border-radius: 5px;
	}
	#contact .contact-form textarea.textarea-small {
		height: 120px !important;
	}
}

#contact .contact-form textarea::placeholder,
#contact .contact-form input[type="text"]::placeholder,
#contact .contact-form input[type="tel"]::placeholder,
#contact .contact-form input[type="email"]::placeholder {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	line-height: 1.6;
	color: rgb(33 59 76 / 40%);
}
@media screen and (min-width:1024px) {
	#contact .contact-form textarea::placeholder,
	#contact .contact-form input[type="text"]::placeholder,
	#contact .contact-form input[type="tel"]::placeholder,
	#contact .contact-form input[type="email"]::placeholder {
		font-size: 1.6rem;
	}
}

#contact .contact-form div.mfp_err {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: calc((100vw / 375) * 13);
	color: #d54d85;
	position: relative;
}
@media screen and (min-width:1024px) {
	#contact .contact-form div.mfp_err {
		font-size: 1.6rem;
		line-height: 2;
		top: 10px;
	}
}

#contact .contact-form .contact-box {
	position: relative;
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20) 0;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-box {
    padding: 90px 150px 0;
    margin: 0 auto;
	}
}

#contact .contact-form .contact-box h2 {
	font-size: calc((100vw / 375) * 21);
	font-weight: bold;
	color: #141517;
	text-align: left;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box h2 {
		font-size: 2.0rem;
	}
}

#contact .contact-form .contact-box p {
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	line-height: 1.9;
	letter-spacing: 0.1rem;
	color: #141517;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box p {
		font-size: 1.8rem;
		padding-top: 10px;
	}
}

#contact .contact-form .contact-box + .contact-box {
	margin-top: calc((100vw / 375) * 25);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box + .contact-box {
		margin-top: 40px;
	}
}

#contact .contact-form .contact-box .agree-area {
	background-color: #f1f5f6;
	border-radius: calc((100vw / 375) * 60);
	display: flex;
	justify-content: center;
	align-items: center;
	height: calc((100vw / 375) * 60);
	margin-top: calc((100vw / 375) * 30);
}
#contact .contact-form .contact-box .agree-area .checkbox-text::before {
	left: calc((100vw / 375) * 13);
}
#contact .contact-form .checkbox.agree-area .checkbox-input.mfp_checked .checkbox-text::after {
	left: calc((100vw / 375) * 22);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box .agree-area {
		border-radius: 40px;
		height: 80px;
		margin-top: 45px;
	}
	#contact .contact-form .contact-box .agree-area .checkbox-text::before {
		left: 0;
	}
	#contact .contact-form .checkbox.agree-area .checkbox-input.mfp_checked .checkbox-text::after  {
		left: 15px;
	}
}

#contact .contact-form .checkbox.agree-area .checkbox-input .checkbox-text::before {
	background-color: #fff;
}
#contact .contact-form .checkbox.agree-area .checkbox-input.mfp_checked  .checkbox-text::before {
	background-color: #7db6be;
}

#contact .contact-form .contact-box .agree-area + .mfp_err {
	text-align: center;
}

#contact .contact-form .checkbox.agree-area .checkbox-input .checkbox-text {
	font-size: calc((100vw / 375) * 13);
	padding: calc((100vw / 375) * 10) 0 calc((100vw / 375) * 10) calc((100vw / 375) * 47);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox.agree-area .checkbox-input .checkbox-text {
		font-size: 1.6rem;
		padding: 0 20px 0 52px;
	}
}

#contact .contact-form .contact-submit {
	padding-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-submit {
		padding-bottom: 150px;
	}
}

#contact .contact-form .contact-submit button {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #fff;
	text-align: center;
	background-color: #093e6d;
	border-radius: calc((100vw / 375) * 60);
	padding-top: calc((100vw / 375) * 15);
	padding-bottom: calc((100vw / 375) * 15);
	margin: calc((100vw / 375) * 40) auto 0;
	white-space: nowrap;
	width: calc((100vw / 375) * 295);
	overflow: hidden;
	appearance: none;
	border: none;
	cursor: pointer;
	transition: all .7s ease;
	z-index: 1;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-submit button {
		font-size: 1.8rem;
		border-radius: 40px;
		padding-top: 27px;
		padding-bottom: 27px;
		margin: 80px auto 0;
		width: 600px;
	}
	#contact .contact-form .contact-submit button:hover {
		color: #093e6d;
		background-color: #fff;
	}
}

#contact .contact-form .contact-submit button::before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 8);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	background: url(./common_img/arrow_circle02.svg) center center / cover no-repeat;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-submit button::before {
		right: 10px;
		width: 60px;
		height: 60px;
	}
}

@media screen and (min-width:1024px) {
	#contact .contact-form .contact-submit button::after {
		content: '';
		display: block;
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translateY(-50%);
		width: 60px;
		height: 60px;
		border-radius: 50%;
		background-color: #e8f0f1;
		transition: all .4s ease;
		z-index: -1;
	}
	#contact .contact-form .contact-submit button:hover::after {
		transform: translateY(-50%) scale(22);
	}
}

#contact .contact-form #mfp_hidden {
	display: none;
}


/* CONTACT：確認 */
#contact .contact-form #mfp_phase_confirm {
	display: none;
	position: relative;
	padding-bottom: calc((100vw / 375) * 100);
	z-index: 10;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm {
		border-radius: 30px;
		padding: 0;
	}
}

@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner {
    display: block;
    max-width: 1400px;
    margin: 0 auto;
	}
}

#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner > h4 {
	display: none;
	font-size: calc((100vw / 375) * 16);
	padding-bottom: calc((100vw / 375) * 5);
	padding-left: calc((100vw / 375) * 10);
	letter-spacing: 0.2rem;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner > h4 {
		font-size: 28px;
    padding-bottom: 60px;
		padding-left: 0;
    letter-spacing: 4px;
	}
}

#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner .confirm_area {
	background-color: #f5f2f0;
	border-radius: 20px;
	padding: 28px 20px 52px 20px;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner .confirm_area {
		padding: 60px 50px;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table {
	position: relative;
	display: block;
	overflow: visible !important;
	width: 100%;
	padding: calc((100vw / 375) * 40) calc((100vw / 375) * 20) calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table {
		padding: 90px 100px 0;		
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table::before {
	content: '';
	display: block;
	width: 100%;
	height: calc(100% + calc((100vw / 375) * 220));
	position: absolute;
	left: 50%;
	top: 0;
	background-color: #fff;
	border-radius: 60px;
	transform: translateX(-50%);
	z-index: -1;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table::before {
		height: calc(100% + 420px);
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table tbody {
	display: block;
	width: 100%;
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table tr {
	display: flex;
  flex-direction: row;
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th,
#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td {
	vertical-align: top;
	text-align: left;
	box-sizing: border-box;
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	color: #141517;
	padding-top: calc((100vw / 375) * 12);
  padding-bottom: calc((100vw / 375) * 16);
	width: 100%;
	border-bottom: 2px solid #7db6be;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th {
    font-size: 1.6rem;
    display: table-cell;
		padding: 34px 22px 34px 50px;
		width: 300px;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th::before {
	content: '';
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	background-color: #7db6be;
	border-radius: 50%;
	position: absolute;
	top: calc((100vw / 375) * 22.5);
	left: calc((100vw / 375) * -12);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th::before {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		top: 44px;
		left: 10px;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	color: #141517;
	border-bottom: none;
	padding-top: calc((100vw / 375) * 12);
	padding-bottom: calc((100vw / 375) * 16);
	width: 100%;
	border-bottom: 2px solid #c8cccd;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td {
    display: table-cell;
		font-size: 1.6rem;
		letter-spacing: 0.1rem;
    padding: 34px 22px 34px 50px;
		width: calc(100% - 300px);
	}
}

#contact .contact-form #mfp_phase_confirm #th_mfp_element_19,
#contact .contact-form #mfp_phase_confirm #td_mfp_element_19 {
	display: none !important;
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc((100vw / 375) * 15);
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons {
		gap: 30px;
		margin-top: 0;
		margin-bottom: 250px;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #fff;
	text-align: center;
	background-color: #093e6d;
	border-radius: calc((100vw / 375) * 60);
	padding-top: calc((100vw / 375) * 15);
	padding-bottom: calc((100vw / 375) * 15);
	margin: calc((100vw / 375) * 40) auto 0;
	white-space: nowrap;
	width: calc((100vw / 375) * 295);
	overflow: hidden;
	appearance: none;
	border: none;
	cursor: pointer;
	transition: all .7s ease;
	z-index: 1;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send {
		font-size: 1.8rem;
		border-radius: 40px;
		padding-top: 27px;
		padding-bottom: 27px;
		margin: 80px auto 0;
		width: 600px;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send:hover {
		color: #093e6d;
		background-color: #fff;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send::before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 8);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	background: url(./common_img/arrow_circle02.svg) center center / cover no-repeat;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send::before {
		right: 10px;
		width: 60px;
		height: 60px;
	}
}

@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send::after {
		content: '';
		display: block;
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translateY(-50%);
		width: 60px;
		height: 60px;
		border-radius: 50%;
		background-color: #e8f0f1;
		transition: all .4s ease;
		z-index: -1;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send:hover::after {
		transform: translateY(-50%) scale(22);
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	letter-spacing: 0.1rem;
	text-align: center;
	background-color: #e8f0f1;
	border-radius: calc((100vw / 375) * 60);
	padding-top: calc((100vw / 375) * 15);
	padding-bottom: calc((100vw / 375) * 15);
	margin: 0 auto;
	white-space: nowrap;
	width: calc((100vw / 375) * 295);
	overflow: hidden;
	appearance: none;
	border: none;
	cursor: pointer;
	transition: all .7s ease;
	z-index: 1;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel {
		font-size: 1.8rem;
		border-radius: 40px;
		padding-top: 27px;
		padding-bottom: 27px;
		margin: 0 auto;
		width: 600px;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel:hover {
		/* background-color: #fff; */
		opacity: .8;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel::before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: calc((100vw / 375) * 8);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	background: url(./common_img/arrow_circle03.svg) center center / cover no-repeat;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel::before {
		left: 10px;
		width: 60px;
		height: 60px;
	}
}

@media screen and (min-width:1024px) {
	/* #contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel::after {
		content: '';
		display: block;
		position: absolute;
		top: 50%;
		left: 10px;
		transform: translateY(-50%);
		width: 60px;
		height: 60px;
		border-radius: 50%;
		background-color: #fff;
		transition: all .4s ease;
		z-index: -1;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel:hover::after {
		transform: translateY(-50%) scale(22);
	} */
}


/* CONTACT：完了 */
#contact.contact-comp .contact-form {
	height: calc(100vh - calc((100vw / 375) * 188));
}
@media screen and (min-width: 1024px) {
	#contact.contact-comp .contact-form {
		height: auto;
	}
}

#contact.contact-comp .contact-form .thanks-desc h2 {
	font-size: calc((100vw / 375) * 23);
	text-align: center;
  padding-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#contact.contact-comp .contact-form .thanks-desc h2 {
		font-size: 4.0rem;
		padding-top: 0;
	}
}

#contact.contact-comp .contact-form .thanks-desc li {
	list-style: none;
}

#contact.contact-comp .contact-form .thanks-desc p {
	font-size: calc((100vw / 375) * 15);
	padding-top: calc((100vw / 375) * 18);
	line-height: 1.8;
}
@media screen and (min-width:1024px) {
	#contact.contact-comp .contact-form .thanks-desc p {
		font-size: 1.8rem;
		padding-top: 35px;
		text-align: center;
	}
}

#contact.contact-comp .thanks-btn {
	display: flex;
	justify-content: center;
	flex-direction: row;
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width:1024px) {
	#contact.contact-comp .thanks-btn {
	  margin-top: 60px;
	}
}


/* ========== COMMON PARTS ========== */
.posit_r { position:relative!important; }
.posit_a { position:absolute!important; }
.posit_f { position:fixed!important; }

.align_c { text-align:center!important; }
.align_r { text-align:right!important; }
.align_l { text-align:left!important; }

.disp_l { float:left!important; }
.disp_r { float:right!important; }

.va_top { vertical-align:top!important; }
.va_mid { vertical-align:middle!important; }
.va_btm { vertical-align:bottom!important; }
.va_sub { vertical-align:sub!important; }

/* ▼width▼ */
.w4per { width:4%; }
.w5per { width:5%; }
.w8per { width:8%; }
.w10per { width:10%; }
.w15per { width:15%; }
.w20per { width:20%; }
.w22per { width:22%; }
.w25per { width:25%; }
.w30per { width:30%; }
.w35per { width:35%; }
.w50per { width:50%; }
.w55per { width:55%; }
.w56per { width:56%; }
.w60per { width:60%; }
.w70per { width:70%; }
.w75per { width:75%; }
.w80per { width:80%; }
.w100per { width:100%!important; }

/* ▼area▼ */
.mb200 { margin-bottom:200px!important; }
.mb160 { margin-bottom:160px!important; }
.mb150 { margin-bottom:150px!important; }
.mb140 { margin-bottom:140px!important; }
.mb130 { margin-bottom:130px!important; }
.mb120 { margin-bottom:120px!important; }
.mb110 { margin-bottom:110px!important; }
.mb100 { margin-bottom:100px!important; }
.mb95 { margin-bottom:95px!important; }
.mb90 { margin-bottom:90px!important; }
.mb85 { margin-bottom:85px!important; }
.mb80 { margin-bottom:80px!important; }
.mb75 { margin-bottom:75px!important; }
.mb70 { margin-bottom:70px!important; }
.mb65 { margin-bottom:65px!important; }
.mb60 { margin-bottom:60px!important; }
.mb55 { margin-bottom:55px!important; }
.mb50 { margin-bottom:50px!important; }
.mb45 { margin-bottom:45px!important; }
.mb40 { margin-bottom:40px!important; }
.mb35 { margin-bottom:35px!important; }
.mb30 { margin-bottom:30px!important; }
.mb25 { margin-bottom:25px!important; }
.mb20 { margin-bottom:20px!important; }
.mb15 { margin-bottom:15px!important; }
.mb12 { margin-bottom:12px!important; }
.mb10 { margin-bottom:10px!important; }
.mb8 { margin-bottom:8px!important; }
.mb5 { margin-bottom:5px!important; }
.mb0 { margin-bottom:0!important; }

.mlr300 { margin-left:300px!important; margin-right:300px!important; }
.mlr115 { margin-left:115px!important; margin-right:115px!important; }
.mlr100 { margin-left:100px!important; margin-right:100px!important; }
.mlr80 { margin-left:80px!important; margin-right:80px!important; }
.mlr75 { margin-left:75px!important; margin-right:75px!important; }
.mlr70 { margin-left:70px!important; margin-right:70px!important; }
.mlr60 { margin-left:60px!important; margin-right:60px!important; }
.mlr55 { margin-left:55px!important; margin-right:55px!important; }
.mlr50 { margin-left:50px!important; margin-right:50px!important; }
.mlr45 { margin-left:40px!important; margin-right:45px!important; }
.mlr40 { margin-left:40px!important; margin-right:40px!important; }
.mlr35 { margin-left:35px!important; margin-right:35px!important; }
.mlr30 { margin-left:30px!important; margin-right:30px!important; }
.mlr25 { margin-left:25px!important; margin-right:25px!important; }
.mlr20 { margin-left:20px!important; margin-right:20px!important; }
.mlr15 { margin-left:15px!important; margin-right:15px!important; }
.mlr10 { margin-left:10px!important; margin-right:10px!important; }
.mlr5 { margin-left:5px!important; margin-right:5px!important; }
.mlr-1 { margin-left:-1px!important; margin-right:-1px!important; }
.mlr-5 { margin-left:-5px!important; margin-right:-5px!important; }
.mlr-10 { margin-left:-10px!important; margin-right:-10px!important; }
.mlr-20 { margin-left:-20px!important; margin-right:-20px!important; }
.mlr-50 { margin-left:-50px!important; margin-right:-50px!important; }
.mlr-100 { margin-left:-100px!important; margin-right:-100px!important; }
.mlr_auto { margin-left:auto!important; margin-right:auto!important; }

.mr50 { margin-right:50px!important; }
.mr40 { margin-right:40px!important; }
.mr30 { margin-right:30px!important; }
.mr25 { margin-right:25px!important; }
.mr20 { margin-right:20px!important; }
.mr15 { margin-right:15px!important; }
.mr10 { margin-right:10px!important; }
.mr5 { margin-right:5px!important; }
.mr0 { margin-right:0px!important; }
.mr-5 { margin-right:-5px!important; }

.ml80 { margin-left:80px!important; }
.ml50 { margin-left:50px!important; }
.ml40 { margin-left:40px!important; }
.ml30 { margin-left:30px!important; }
.ml20 { margin-left:20px!important; }
.ml15 { margin-left:15px!important; }
.ml10 { margin-left:10px!important; }
.ml0 { margin-left:0px!important; }
.ml-5 { margin-left:-5px!important; }
.ml-10 { margin-left:-10px!important; }
.ml-15 { margin-left:-15px!important; }
.ml-20 { margin-left:-20px!important; }

.mt120 { margin-top:120px!important; }
.mt90 { margin-top:90px!important; }
.mt80 { margin-top:80px!important; }
.mt70 { margin-top:70px!important; }
.mt60 { margin-top:60px!important; }
.mt55 { margin-top:55px!important; }
.mt50 { margin-top:50px!important; }
.mt45 { margin-top:45px!important; }
.mt40 { margin-top:40px!important; }
.mt35 { margin-top:35px!important; }
.mt30 { margin-top:30px!important; }
.mt20 { margin-top:20px!important; }
.mt15 { margin-top:15px!important; }
.mt10 { margin-top:10px!important; }
.mt5 { margin-top:5px!important; }
.mt3 { margin-top:3px!important; }
.mt0 { margin-top:0!important; }
.mt-5 { margin-top:-5px!important; }
.mt-10 { margin-top:-10px!important; }
.mt-20 { margin-top:-20px!important; }
.mt-40 { margin-top:-40px!important; }
.mt-50 { margin-top:-50px!important; }
.mt-60 { margin-top:-60px!important; }
.mt-70 { margin-top:-70px!important; }
.mt-80 { margin-top:-80px!important; }

.pb100 { padding-bottom:100px!important; }
.pb80 { padding-bottom:80px!important; }
.pb30 { padding-bottom:30px!important; }
.pb8 { padding-bottom:8px!important; }
.pb0 { padding-bottom:0!important; }

.p20 { padding:20px!important; }
.p15 { padding:15px!important; }
.p10 { padding:10px!important; }

.pt60 { padding-top:60px!important; }
.pt50 { padding-top:50px!important; }
.pt20 { padding-top:20px!important; }
.pt15 { padding-top:20px!important; }
.pt0  { padding-top:0!important; }

.ptb20 { padding-top:20px!important; padding-bottom:20px!important; }
.ptb15 { padding-top:15px!important; padding-bottom:15px!important; }
.ptb5 { padding-top:5px!important; padding-bottom:5px!important; }
.ptb0 { padding-top:0!important; padding-bottom:0!important; }

.plr25 { padding-left:25px!important; padding-right:25px!important; }

/* キーフレーム */
@keyframes fadein-anime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.98;
  }
}
@keyframes fadeout-anime {
  0% {
    opacity: 0.98;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
	}
}