@charset "UTF-8";
/* CSS Document */

	
/*
フォントウェイト
========================*/
.bold { font-weight:bold; }
	

/*
align
========================*/
.alignL { text-align:left; }
.alignR { text-align:right; }
.alignC { text-align:center; }


/*
position 
========================*/
.pos_center {margin-inline:auto;width:fit-content;}
.pos_right {margin-inline-start:auto;width:fit-content;}

/*
ホバースケール
========================*/
.scale figure {overflow: hidden;}
.scale figure img {transition:transform 1s cubic-bezier(0.25, 1, 0.5, 1);}
.scale:hover figure img {transform:scale(1.1);}


/*
ボタン クローズ
========================*/
.close_button {
	display:flex;
  justify-content: center;
	align-items: center;
  gap:0.5rem;
	line-height: 1;
}
.close_button i {
  display:block;
	position: relative;
	width:1em;
	height:1em;
}
.close_button i::before,
.close_button i::after {
	content:"";
	display:block;
	width:100%;
	height: 2px;
	background-color: currentColor;
	position: absolute;
	left:0;
	transition:all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
}

.close_button i::before {
	top:0;
}
.close_button i::after {
	top:100%;
}

.close_button i::before,
.close_button i::after {
	top:50%;
}
.close_button i::before {
	transform:rotate(45deg);
}
.close_button i::after {
	transform:rotate(-45deg);
}

/*
デバイス 表示
========================*/
@media(min-width:769px) {
  .sp {display:none !important;}
}
@media(max-width:768px) {
  .pc {display:none !important;}
}


/*
ボタン　アイコン
========================*/
.org-icon {
  display:flex;
  align-items:center;
  gap:0.5em;
}
.org-icon > i {
	font-style: normal;
}
.org-icon > i,
.org-icon::before {
  content:"";
  display:block;
  width:1em;
  aspect-ratio:1 / 1;
  background-position: center center;
  background-repeat:no-repeat;
  background-size:contain;
}
.icon_pos_after::before {
  order:1;
}

.icon_type_circle::before {
  background-color:var(--color_orange);
  border-radius: 100px;
  width:0.7em;
}

.icon_type_circle.icon_color_inherit::before {
  background-color: currentColor;
}

.icon_type_arrow::before {
  background-image:url("../images/icon_arrow.svg");
	transform:scale(1.3);
}
.icon_type_arrow2::before {
  background-image:url("../images/icon_arrow2.svg");
}
.icon_type_arrow2:hover::before {
  background-image:url("../images/icon_arrow2_hover.svg");
}

.icon_type_image {
  display:flex !important;
	justify-content: center;
  align-items:center;
	line-height: 1;
}
.icon_type_image i {
	display:block;
}
.icon_type_image i img {
	vertical-align: top;
	width:auto;
	height:100%;
	max-width:none;
	object-fit: contain;
	object-position: center center;
}
.icon_type_image::before {display:none;}

.icon_heading {
	display:flex !important;
  align-items:center;
	line-height: 1.3;
	gap:0.5em;
}
.icon_heading::before {display:none;}
.icon_heading i {
	background: var(--color_orange);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 2em;
  border-radius: 4px;
	white-space: nowrap;
	padding:0.5rem;
	font-style: normal;
}
.icon_heading > *:first-child {
	align-self:flex-start;
}
.icon_heading > *:last-child {
	flex:1;
	display: block;
}

/*
ボタン　ハンバーガー
========================*/
#menuButton {
	position: relative;
	
}
#menuButton span,
#menuButton::before,
#menuButton::after {
	content:"";
	display:block;
	width:100%;
	height: 2px;
	background: #000;
	position: absolute;
	left:0;
	transition:all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
}
#menuButton span {
	top:50%;
}
#menuButton::before {
	top:0;
}
#menuButton::after {
	top:100%;
}

.menuopen #menuButton span {opacity:0;}
.menuopen #menuButton::before,
.menuopen #menuButton::after {
	top:50%;
}
.menuopen #menuButton::before {
	transform:rotate(45deg);
}
.menuopen #menuButton::after {
	transform:rotate(-45deg);
}
	
/*
テーブル
========================*/
.tl{
	display:table;
	border-collapse:collapse;
	width:100%;
	table-layout:fixed;
	}
.tl > * {
	display:table-cell;
	vertical-align:top;
	}
@media(max-width:768px) {
	.tl.tbReset,
	.tl.tbReset > * {
		display:block;
		margin:30px 0 0 0 !important;
		width:100% !important;
	}
}
@media(max-width:560px) {
	.tl.spReset,
	.tl.spReset > * {
		display:block;
		margin:30px 0 0 0 !important;
		width:100% !important;
	}
}

/*
accordion
========================*/
a.acd {
  
}
a.acd + * {
  display:none;
}

/*
flex
========================*/
.flex {
  display:flex;
  justify-content: flex-start;
  align-items:center;
}

/*
カラム
========================*/
.alignitems_center {align-items:center;}

.col {
	display:flex;
	flex-wrap: wrap;
  gap:1.7rem;
}
.col.justifyCenter {
	justify-content: center;
}

.col2 > * {
	width:calc(50% - 1.7rem / 2);
}
.col2_large_gap {gap:6rem;}
.col2_large_gap > * {
	width:calc(50% - 6rem / 2);
}
.col3 > * {
	width:calc((100% - (1.7rem * 2)) / 3);
}
.col4 > * {
	width:calc((100% - (1.7rem * 3)) / 4);
}

@media(max-width:768px) and (min-width:561px){
	.tb_col1 > * {
	width:100% !important;
	}
  .tb_col2 {gap:3vw;}
	.tb_col2 > * {
	  width:calc((100% - 3vw - 1px) / 2);
  }
  .tb_col3 > * {
    width:calc((100% - (1.7rem * 2)) / 3);
  }
  .tb_col4 > * {
    width:calc((100% - (1.7rem * 3)) / 4);
  }
}
@media(max-width:560px){
	.sp_col1 > * {
	width:100% !important;
	}
	.sp_col2 {gap:3vw;}
  .sp_col2 > * {
    width:calc((100% - 3vw - 1px) / 2);
  }
  .sp_col3 > * {
    width:calc((100% - (1.7rem * 2)) / 3);
  }
  .sp_col4 > * {
    width:calc((100% - (1.7rem * 3)) / 4);
  }
}

/*swiper UI*/
.swiper {
  padding-bottom: 3rem !important;
}
.swiper-button-next,
.swiper-button-prev {
  width:3.57rem !important;
	height:auto !important;
  aspect-ratio:1 / 1;
  background:#fff;
  border-radius:100px;
  display:flex;
  justify-content: center;
  align-items:center;
}
.swiper-button-next::after,
.swiper-button-prev::after {
  font-size:1.5rem !important;
  font-weight: bold;
	color:var(--color_orange);
}

.swiper-pagination .swiper-pagination-bullet {
  opacity:1 !important;
  background:#ececec !important;
  width:12px !important;
  height:12px !important;
  margin: 0 0.5rem !important;
}
.swiper-pagination .swiper-pagination-bullet-active {
  background:var(--color_orange) !important;
}

/*========================
アニメーション

・css easing
easeOutQuart
cubic-bezier(0.165, 0.84, 0.44, 1);

easeInOutQuart
cubic-bezier(0.77, 0, 0.175, 1);
========================*/

/*スライドイン 左から右*/
.slideRight {
	-webkit-transform:translateX(-30px);
	transform:translateX(-30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	}
.slideRight.on {
	-webkit-transform:translateX(0px);
	transform:translateX(0px);
	opacity:1;
	}

/*スライドイン 右から左*/
.slideLeft {
	-webkit-transform:translateX(30px);
	transform:translateX(30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	}
.slideLeft.on {
	-webkit-transform:translateX(0px);
	transform:translateX(0px);
	opacity:1;
	}
	
/*スライドイン 上から下*/
.slideDown {
	-webkit-transform:translateY(-30px);
	transform:translateY(-30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	z-index:1;
	}
.slideDown.on {
	-webkit-transform:translateY(0px);
	transform:translateY(0px);
	opacity:1;
	}
	
/*スライドイン 下から上*/
.slideUp {
	-webkit-transform:translateY(30px);
	transform:translateY(30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	z-index:1;
	}
.slideUp.on {
	-webkit-transform:translateY(0px);
	transform:translateY(0px);
	opacity:1;
	}

/*フェードイン*/
.fadeIn {opacity:0;-webkit-transition:opacity 0.5s linear;transition:opacity 0.5s linear;}
.fadeIn.on {opacity:1;}

/*フェードアウト*/
.fadeOut {opacity:1;-webkit-transition:opacity 0.5s linear;transition:opacity 0.5s linear;}
.fadeOut.on {opacity:0;}

/*スライド 幅*/
.slideWidth {
	width:0;
	overflow: hidden;
	-webkit-transition:width 1s cubic-bezier(0.77, 0, 0.175, 1);
	transition:width 1s cubic-bezier(0.77, 0, 0.175, 1);
	}
.slideWidth.on {
	width:100%;
	}