@charset "utf-8";


/*===========================================

↓↓↓↓↓機能、構成やレイアウトに関するcss

===========================================*/


/*===============================
フレックスボックス
===============================*/
.flex {
	display: flex;
}
.fl_btw_str {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}
.fl_btw_sta {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.fl_btw_cen {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.fl_aro_str {
	display: flex;
	justify-content: space-around;
	align-items: stretch;
}
.fl_aro_sta {
	display: flex;
	justify-content: space-around;
	align-items: flex-start;
}
.fl_aro_cen {
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.fl_cen_str {
	display: flex;
	justify-content: center;
	align-items: stretch;
}
.fl_cen_sta {
	display: flex;
	justify-content: center;
	align-items: flex-start;
}
.fl_cen_cen {
	display: flex;
	justify-content: center;
	align-items: center;
}
.fl_sta_str {
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
}
.fl_sta_sta {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.fl_sta_cen {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
/* flex-flow */
.col_wrap{
	flex-flow: column wrap;
}
.col_nowrap{
	flex-flow: column nowrap;
}
.col_wrap-rev{
	flex-flow: column wrap-reverse;
}
.row_wrap{
	flex-flow: row wrap;
}
.row_nowrap{
	flex-flow: row nowrap;
}
.row-rev_wrap{
	flex-flow: row-reverse wrap;
}
.row-rev_nowrap{
	flex-flow: row-reverse nowrap;
}
.row_wrap-rev{
	flex-flow: row wrap-reverse;
}
.row-rev_wrap-rev{
	flex-flow: row-reverse wrap-reverse;
}

/*フレックスボックスの均等分割
-------------------------------*/
*[class^="fl_"] {
	/*background: red;*/
}
.-cut2,
.-cut3,
.-cut4,
.-cut5,
.-cut6,
.-cut7,
.-cut8 {
	column-gap: 4rem;
}
/* 1/2 */
.-cut2 > .fl_item {
	width: calc(100%/2 - (4rem/2));
}
.-cut2.gap-c0 > .fl_item {
	width: 50%;
}
/* 1/3 */
.-cut3 > .fl_item {
	width: calc(100%/3 - (8rem/3));
}
.-cut3.gap-c0 > .fl_item {
	width: calc(100%/3);
}
/* 1/4 */
.-cut4 > .fl_item {
	width: calc(100%/4 - (12rem/4));
}
.-cut4.gap-c0 > .fl_item {
	width: calc(100%/4);
}
/* 1/5 */
.-cut5 > .fl_item {
	width: calc(100%/5 - (16rem/5));
}
.-cut5.gap-c0 > .fl_item {
	width: calc(100%/5);
}
/* 1/6 */
.-cut6 > .fl_item {
	width: calc(100%/6 - (20rem/6));
}
.-cut6.gap-c0 > .fl_item {
	width: calc(100%/6);
}
/* 1/7 */
.-cut7 > .fl_item {
	width: calc(100%/7 - (24rem/7));
}
.-cut7.gap-c0 > .fl_item {
	width: calc(100%/7);
}
/* 1/8 */
.-cut8 > .fl_item {
	width: calc(100%/8 - (28rem/8));
}
.-cut8.gap-c0 > .fl_item {
	width: calc(100%/8);
}

/*フレックスボックスのgap
-------------------------------*/
/*
左右のgapを1rem＝10pxにすることで
タブレット表示の際に1rem＝8pxとなり
少し隙間を小さくする
*/
/*左右の隙間*/
.gap-c0 {
	column-gap: 0;
}
.gap-c10 {
	column-gap: 1rem;
}
.gap-c20 {
	column-gap: 2rem;
}
.gap-c30 {
	column-gap: 3rem;
}
.gap-c40 {
	column-gap: 4rem;
}
/*上下の隙間*/
.gap-r0 {
	row-gap: 0;
}
.gap-r10 {
	row-gap: 10px;
}
.gap-r20 {
	row-gap: 20px;
}
.gap-r30 {
	row-gap: 30px;
}
.gap-r40 {
	row-gap: 40px;
}
.gap-r50 {
	row-gap: 50px;
}
.gap-r60 {
	row-gap: 60px;
}
.gap-r70 {
	row-gap: 70px;
}
.gap-r80 {
	row-gap: 80px;
}

/*fl_itemの割合
-------------------------------*/
/*flex boxで左右に並ぶ2つのアイテムの幅を％で管理*/
.fl_item.-w20p {
	width: calc(20% - 2rem);
}
.fl_item.-w21p {
	width: calc(21% - 2rem);
}
.fl_item.-w22p {
	width: calc(22% - 2rem);
}
.fl_item.-w24p {
	width: calc(24% - 2rem);
}
.fl_item.-w25p {
	width: calc(25% - 2rem);
}
.fl_item.-w26p {
	width: calc(26% - 2rem);
}
.fl_item.-w28p {
	width: calc(28% - 2rem);
}
.fl_item.-w30p {
	width: calc(30% - 2rem);
}
.fl_item.-w32p {
	width: calc(32% - 2rem);
}
.fl_item.-w34p {
	width: calc(34% - 2rem);
}
.fl_item.-w36p {
	width: calc(36% - 2rem);
}
.fl_item.-w37p {
	width: calc(37% - 2rem);
}
.fl_item.-w38p {
	width: calc(38% - 2rem);
}
.fl_item.-w40p {
	width: calc(40% - 2rem);
}
.fl_item.-w42p {
	width: calc(42% - 2rem);
}
.fl_item.-w43p {
	width: calc(43% - 2rem);
}
.fl_item.-w46p {
	width: calc(46% - 2rem);
}
.fl_item.-w47p {
	width: calc(47% - 2rem);
}
.fl_item.-w48p {
	width: calc(48% - 2rem);
}
.fl_item.-w50p {
	width: calc(50% - 2rem);
}
.fl_item.-w52p {
	width: calc(52% - 2rem);
}
.fl_item.-w53p {
	width: calc(53% - 2rem);
}
.fl_item.-w54p {
	width: calc(54% - 2rem);
}
.fl_item.-w57p {
	width: calc(57% - 2rem);
}
.fl_item.-w58p {
	width: calc(58% - 2rem);
}
.fl_item.-w60p {
	width: calc(60% - 2rem);
}
.fl_item.-w62p {
	width: calc(62% - 2rem);
}
.fl_item.-w63p {
	width: calc(63% - 2rem);
}
.fl_item.-w64p {
	width: calc(64% - 2rem);
}
.fl_item.-w66p {
	width: calc(66% - 2rem);
}
.fl_item.-w68p {
	width: calc(68% - 2rem);
}
.fl_item.-w70p {
	width: calc(70% - 2rem);
}
.fl_item.-w72p {
	width: calc(72% - 2rem);
}
.fl_item.-w74p {
	width: calc(74% - 2rem);
}
.fl_item.-w75p {
	width: calc(75% - 2rem);
}
.fl_item.-w76p {
	width: calc(76% - 2rem);
}
.fl_item.-w78p {
	width: calc(78% - 2rem);
}
.fl_item.-w79p {
	width: calc(79% - 2rem);
}
.fl_item.-w80p {
	width: calc(80% - 2rem);
}

/*マージントップ
-------------------------------*/
.mt_auto {
	margin-top: auto;
}


/*================================
幅と高さの指定
================================*/

/*※幅と高さのpx指定、％指定について*/
/*================================

幅と高さの指定は以下の6種
・width と height
・max width と max height
・min width と min height

6種それぞれにpx指定した場合と、％指定した場合の2パターンがあります。

------------------------------
例：width, height（px指定）
------------------------------
width: 480px; → .w480, w480-tab, w480-sp
height: 480px; → .h480, h480-tab, h480-sp

.w〇-tab = タブレットの際に〇px
.w〇-sp = スマホの際に〇px


------------------------------
例：width, height（％指定）
------------------------------
・末尾にpercentの意味でpを追加

width: 100%; → .w100p, w100p-tab, w100p-sp
height: 100%; → .h100p, h100p-tab, h100p-sp


------------------------------
例：max width, max height（px指定）
------------------------------
・頭にmaxの意味でmx-を追加

max width: 480px; → .mx-w480, .mx-w480-tab, .mx-w480-sp
max height: 480px; → .mx-h480, .mx-h480-tab, .mx-h480-sp


------------------------------
例：max width, max height（％指定）
------------------------------
・末尾にpercentの意味でpを追加

max width: 100%; → .mx-w100p, .mx-w100p-tab, .mx-w100p-sp
max height: 100%; → .mx-h100p, .mx-h100p-tab, .mx-h100p-sp


------------------------------
例：min width, min height（px指定）
------------------------------
・頭にminの意味でmn-を追加

min width: 480px; → .mn-w480, .mn-w480-tab, .mn-w480-sp
min height: 480px; → .mn-h480, .mn-h480-tab, .mn-h480-sp


------------------------------
例：min width, min height（％指定）
------------------------------
・末尾にpercentの意味でpを追加

min width: 100%; → .mn-w100p, .mn-w100p-tab, .mn-w100p-sp
min height: 100%; → .mn-h100p, .mn-h100p-tab, .mn-h100p-sp

================================*/


/*width（px指定）
-------------------------------*/
.w480 {
	width: 480px;
}
.w490 {
	width: 490px;
}

/*width（％指定）
-------------------------------*/
.w100p {
	width: 100%;
}

/*height（px指定）
-------------------------------*/
.h00 {
	height: 00px;
}

/*height（％指定）
-------------------------------*/
.h100p {
	height: 100%;
}

/*max width（px指定）
-------------------------------*/
.mx-w360 {
	max-width: 360px;
	width: 100%;
}
.mx-w400 {
	max-width: 400px;
	width: 100%;
}
.mx-w490 {
	max-width: 490px;
	width: 100%;
}
.mx-w530 {
	max-width: 530px;
	width: 100%;
}
.mx-w670 {
	max-width: 670px;
	width: 100%;
}
.mx-w755 {
	max-width: 755px;
	width: 100%;
}
.mx-w840 {
	max-width: 840px;
	width: 100%;
}
.mx-w860 {
	max-width: 860px;
	width: 100%;
}

/*max width（％指定）
-------------------------------*/
.mx-w100p {
	max-width: 100%;
	width: 100%;
}

/*max height（px指定）
-------------------------------*/
.mx-h00 {
	max-height: 00px;
}

/*max height（％指定）
-------------------------------*/
.mx-h100p {
	max-height: 100%;
}

/*min width（px指定）
-------------------------------*/
.mn-w00 {
	min-width: 00px;
}

/*min width（％指定）
-------------------------------*/
.mn-w100p {
	min-width: 100%;
}

/*min height（px指定）
-------------------------------*/
.mn-h00 {
	min-height: 00px;
}

/*min height（％指定）
-------------------------------*/
.mn-h100p {
	min-height: 100%;
}







/*================================
↓　各ブレイクポイント毎の flex-direction
==================================
横並びのアイテムのflex-direction を column に変更して
タブレット・スマホ幅で見やすいように変更する
==================================
.col_wrap-pc…………………ノートPCで縦並びにする
.col_wrap-tab_lg………タブレット(横画面)で縦並びにする
.col_wrap-tab………………タブレット(縦画面)で縦並びにする
.col_wrap-sp…………………スマホで縦並びにする
================================*/



/*================================
ノートPC 1366px～0px
================================*/
@media (max-width: 1366px) {
	/* flex-flow　縦並び
	-------------------------------*/
	.col_wrap-pc {
		flex-flow: column wrap;
	}
	.col_wrap-pc > .fl_item {
		width: 100%!important;
	}
}


/*================================
TABLET横 1080px～0px
================================*/
@media screen and (max-width: 1080px) {
	/* flex-flow　縦並び
	-------------------------------*/
	.col_wrap-tab_lg {
		flex-flow: column wrap;
	}
	.col_wrap-tab_lg > .fl_item {
		width: 100%!important;
	}
}


/*================================
TABLET縦 834px～0px
================================*/
@media screen and (max-width: 834px) {
	/* flex-flow　縦並び
	-------------------------------*/
	.col_wrap-tab {
		flex-flow: column wrap;
	}
	.col_wrap-tab > .fl_item {
		width: 100%!important;
	}

	/*フレックスボックスの均等分割
	-------------------------------*/
	/* 1/2 */
	.-cut2-tab > .fl_item {
		width: calc(100%/2 - (4rem/2));
	}
	.-cut2-tab.gap-c0 > .fl_item {
		width: 50%;
	}
	/* 1/3 */
	.-cut3-tab > .fl_item {
		width: calc(100%/3 - (8rem/3));
	}
	.-cut3-tab.gap-c0 > .fl_item {
		width: calc(100%/3);
	}
	/* 1/4 */
	.-cut4-tab > .fl_item {
		width: calc(100%/4 - (12rem/4));
	}
	.-cut4-tab.gap-c0 > .fl_item {
		width: calc(100%/4);
	}

	/*フレックスボックスのgap
	-------------------------------*/
	/*上下の隙間*/
	.gap-r0-sp {
		row-gap: 0;
	}
	.gap-r10-sp {
		row-gap: 10px;
	}
	.gap-r20-sp {
		row-gap: 20px;
	}
	.gap-r30-sp {
		row-gap: 30px;
	}
	.gap-r40-sp {
		row-gap: 40px;
	}

	/*================================
	幅と高さの指定
	================================*/
	
	/*width（px指定）
	-------------------------------*/
	.w00-tab {
		width: 00px;
	}

	/*width（％指定）
	-------------------------------*/
	.w100p-tab {
		width: 100%;
	}

	/*height（px指定）
	-------------------------------*/
	.h00-tab {
		height: 00px;
	}

	/*height（％指定）
	-------------------------------*/
	.h100p-tab {
		height: 100%;
	}

	/*max width（px指定）
	-------------------------------*/
	.mx-w00-tab {
		max-width: 00px;
		width: 100%;
	}

	/*max width（％指定）
	-------------------------------*/
	.mx-w100p-tab {
		max-width: 100%;
		width: 100%;
	}

	/*max height（px指定）
	-------------------------------*/
	.mx-h00-tab {
		max-height: 00px;
	}

	/*max height（％指定）
	-------------------------------*/
	.mx-h100p-tab {
		max-height: 100%;
	}

	/*min width（px指定）
	-------------------------------*/
	.mn-w00-tab {
		min-width: 00px;
	}

	/*min width（％指定）
	-------------------------------*/
	.mn-w100p-tab {
		min-width: 100%;
	}

	/*min height（px指定）
	-------------------------------*/
	.mn-h00-tab {
		min-height: 00px;
	}

	/*min height（％指定）
	-------------------------------*/
	.mn-h100p-tab {
		min-height: 100%;
	}
	
	
}


/*================================
SP表示 667px～0px
================================*/
@media (max-width: 667px)  {
	/* flex-flow　縦並び
	-------------------------------*/
	.col_wrap-sp {
		flex-flow: column wrap;
	}
	.col_wrap-sp > .fl_item {
		width: 100%!important;
	}

	/*フレックスボックスの均等分割
	-------------------------------*/
	.-cut2,
	.-cut3,
	.-cut4,
	.-cut5,
	.-cut6,
	.-cut7,
	.-cut8 {
		column-gap: 20px;
	}
	/* 1/2 */
	.-cut2 > .fl_item {
		width: calc(100%/2 - (20px/2));
	}
	/* 1/3 */
	.-cut3 > .fl_item {
		width: calc(100%/3 - (40px/3));
	}
	/* 1/4 */
	.-cut4 > .fl_item {
		width: calc(100%/4 - (60px/4));
	}

	/*フレックスボックスの均等分割
	-------------------------------*/
	/* 1/2 */
	.-cut2-tab > .fl_item {
		width: calc(100%/2 - (20px/2));
	}
	/* 1/3 */
	.-cut3-tab > .fl_item {
		width: calc(100%/3 - (40px/3));
	}
	/* 1/4 */
	.-cut4-tab > .fl_item {
		width: calc(100%/4 - (60px/4));
	}

	/*フレックスボックスの均等分割
	-------------------------------*/
	/* 1/2 */
	.-cut2-sp > .fl_item {
		width: calc(100%/2 - (20px/2));
	}
	/* 1/3 */
	.-cut3-sp > .fl_item {
		width: calc(100%/3 - (40px/3));
	}
	/* 1/4 */
	.-cut4-sp > .fl_item {
		width: calc(100%/4 - (60px/4));
	}
	/* 1/2 */
	.-cut2-sp > .fl_item {
		width: calc(100%/2 - (20px/2));
	}

	
	/*================================
	幅と高さの指定
	================================*/

	/*width（px指定）
	-------------------------------*/
	.w00-sp {
		width: 00px;
	}

	/*width（％指定）
	-------------------------------*/
	.w100p-sp {
		width: 100%;
	}

	/*height（px指定）
	-------------------------------*/
	.h00-sp {
		height: 00px;
	}

	/*height（％指定）
	-------------------------------*/
	.h100p-sp {
		height: 100%;
	}

	/*max width（px指定）
	-------------------------------*/
	.mx-w00-sp {
		max-width: 00px;
		width: 100%;
	}
	.mx-w120-sp {
		max-width: 120px;
		width: 100%;
	}
	.mx-w200-sp {
		max-width: 200px;
		width: 100%;
	}

	/*max width（％指定）
	-------------------------------*/
	.mx-w100p-sp {
		max-width: 100%;
		width: 100%;
	}

	/*max height（px指定）
	-------------------------------*/
	.mx-h00-sp {
		max-height: 00px;
	}

	/*max height（％指定）
	-------------------------------*/
	.mx-h100p-sp {
		max-height: 100%;
	}

	/*min width（px指定）
	-------------------------------*/
	.mn-w00-sp {
		min-width: 00px;
	}

	/*min width（％指定）
	-------------------------------*/
	.mn-w100p-sp {
		min-width: 100%;
	}

	/*min height（px指定）
	-------------------------------*/
	.mn-h00-sp {
		min-height: 00px;
	}

	/*min height（％指定）
	-------------------------------*/
	.mn-h100p-sp {
		min-height: 100%;
	}
	

}

/*===========================================

↑↑↑↑↑機能、構成やレイアウトに関するcss

===========================================*/







/*===========================================

↓↓↓↓↓外観、デザインや飾りに関するcss

===========================================*/


/*================================
コンテナ類、幅制御
===============================*/
.main {}
.section {
	padding-top: 8rem;
	padding-bottom: 8rem;
}
.section .inner {
	max-width: calc(1020px + 14rem);
}
.content {}
.content:not(:last-child) {
	padding-bottom: 8rem;
}

/*================================
メインビジュアル
===============================*/

/* 見出し
================================*/
/*section_title*/
/*-----------------------------*/
.section_title {
	margin-bottom: 50px;
}
.section_title .main-text {
	font-size: 4rem;
	font-weight: 700;
	text-align: center;
	line-height: 1.4;
	letter-spacing: 0.05em;
	color: var(--theme-color01);
}
.section_title .sub-text {
	font-size: 2.2rem;
	font-weight: 700;
	text-align: center;
	line-height: 1.4;
	letter-spacing: 0.05em;
	color: var(--theme-color01);
}
.section_title .en {
	padding-top: 10px;
	font-family: 'Viga', sans-serif;
	font-size: 1.8rem;
	font-weight: 400;
	text-align: center;
	line-height: 1;
	color: var(--theme-color01);
}
/*content_title*/
/*-----------------------------*/
.content_title01 {
	margin-bottom: 40px;
	font-size: 3.6rem;
	font-weight: 700;
	text-align: center;
	line-height: 1.4;
	letter-spacing: 0.05em;
}
.content_title02 {
	margin-bottom: 20px;
	font-size: 2.8rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.05em;
	color: var(--theme-color01);
}
/*item_title*/
/*-----------------------------*/
.item_title01 {
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1.4;
}
.item_title02 {
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.4;
}
.item_title03 {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.4;
}
.item_title04 {
	font-weight: 700;
	line-height: 1.4;
}
.item_title05 {
	position: relative;
	z-index: 1;
	margin-bottom: 20px;
	padding-bottom: 14px;
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.4;
	color: var(--theme-color01);
}
.item_title05::after {
	position: absolute;
	z-index: 1;
	content: "";
	left: 0;
	bottom: 0;
	width: 100%;
	height: 4px;
	border-top: 1px solid var(--accent-color);
	border-bottom: 1px solid var(--accent-color);
}
.item_title06 {
	margin-bottom: 30px;
	padding-bottom: 20px;
	border-bottom: 1px solid #f9d22d;
	font-size: 2rem;
	font-weight: 700;
	text-align: center;
	line-height: 1.4;
}
.item_title06 .text {
	display: inline-block;
	text-align: left;
}
/*マーカー*/
/*-----------------------------*/
.marker01 {
	text-decoration-line: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: #fce952;
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}
.marker02 {
	text-decoration-line: underline;
	text-decoration-thickness: 1.2em;
	text-decoration-color: var(--theme-color01);
	text-underline-offset: -1em;
	text-decoration-skip-ink: none;
}
/*吹き出し*/
/*-----------------------------*/
.speech {
	display: flex;
	justify-content: center;
	align-items: flex-end;
}
.speech::before {
	content: "＼";
	margin-right: 0.2em;
}
.speech::after {
	content: "／";
	margin-left: 0.2em;
}

/* フレーム
================================*/
/*padding*/
.frame-pd20 {
	padding: 20px;
}
.frame-pd30 {
	padding: 30px;
}
.frame-pd40 {
	padding: 40px;
}
.frame-pd50 {
	padding: 50px;
}
/*border*/
[class*="frame-"].-border01 {
	border: 1px solid var(--theme-color01);
}
[class*="frame-"].-border02 {
	border: 1px solid #333;
}
/*rounded*/
[class*="frame-"].-rounded01 {
	border-radius: 10px;
}
[class*="frame-"].-rounded02 {
	border-radius: 20px;
}
/*shadow*/
[class*="frame-"].-shadow01 {
	box-shadow: 2rem 2rem #fce952;
}

/* 背景（コンテンツ幅）
================================*/
.bg-theme01 {
	background: var(--theme-color01);
}
.bg-theme02 {
	background: var(--theme-color02);
}
.bg-accent {
	background: var(--accent-color);
}
.bg-fff {
	background: #fff;
}
.bg-eee {
	background: #eee;
}
.bg-f5f5f5 {
	background: #f5f5f5;
}
.bg-30cadc {
	background: #30cadc;
}
.bg-31b29a {
	background: #31b29a;
}
.bg-f8b551 {
	background: #f8b551;
}
.bg-f59f49 {
	background: #f59f49;
}
.bg-e46ea6 {
	background: #e46ea6;
}
.bg-fef7c2 {
	background: #fef7c2;
}
.pattern01 {
	background: url(../img/pattern01.jpg)top center;
}
.pattern02 {
	background: url(../img/pattern02.jpg)top center;
}
.pattern03 {
	background: url(../img/pattern03.jpg)top center;
}
.pattern04 {
	background: url(../img/pattern04.png)top center;
}

/* 文字サイズ
================================*/
.fs16 {
	font-size: 1.6rem;
	vertical-align: baseline;
}
.fs18 {
	font-size: 1.8rem;
	vertical-align: baseline;
}
.fs20 {
	font-size: 2rem;
	vertical-align: baseline;
}
.fs22 {
	font-size: 2.2rem;
	vertical-align: baseline;
}
.fs24 {
	font-size: 2.4rem;
	vertical-align: baseline;
}
.fs26 {
	font-size: 2.6rem;
	vertical-align: baseline;
}

/* チェックリストなど
================================*/
/*check*/
.li-check {}
/*dot*/
.li-dot {
	position: relative;
	padding-left: 1.2em;
	line-height: 1.4;
	text-align: left;
}
.li-dot::before {
	position: absolute;
	content: "";
	left: 0.4em;
	top: 0.6em;
	width: 0.6rem;
	height: 0.6rem;
	background: var(--theme-color01);
	border-radius: 50%;
}
.li-dot:not(:last-child) {
	margin-bottom: 1rem;
}
/*square*/
.li-square {
	position: relative;
	padding-left: 1.4em;
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.4;
	text-align: left;
}
.li-square::before {
	position: absolute;
	content: "";
	left: 0.2em;
	top: 0.4em;
	width: 1.4rem;
	height: 1.4rem;
	background: var(--theme-color01);
	border-radius: 2px;
}
.li-square:not(:last-child) {
	margin-bottom: 2rem;
}
/*矢印アイコン*/
/*------------------------------*/
.flow_arrow {}

/* 
================================*/




/*================================
ノートPC 1366px～0px
================================*/
@media (max-width: 1366px) {}


/*================================
TABLET横 1080px～0px
================================*/
@media (max-width: 1080px) {

	/*================================
	コンテナ類、幅制御
	===============================*/
	.main {}
	.section {}
	.section .inner {}
	.content {}
	.content:not(:last-child) {}

	/*================================
	メインビジュアル
	===============================*/

	/* 見出し
	================================*/
	/*section_title*/
	/*-----------------------------*/
	.section_title {}
	.section_title .main-text {}
	.section_title .en {}
	/*content_title*/
	/*-----------------------------*/
	.content_title01 {}
	.content_title02 {}
	/*item_title*/
	/*-----------------------------*/
	.item_title01 {}
	.item_title02 {}
	.item_title03 {}
	.item_title04 {}

	/* フレーム
	================================*/
	/*padding*/
	.frame-pd20 {}
	.frame-pd30 {}
	.frame-pd40 {}
	.frame-pd50 {}
	/*border*/
	[class*="frame-"].-border01 {}
	/*shadow*/
	[class*="frame-"].-shadow01 {}

	/* チェックリストなど
	================================*/
	/*check*/
	.li-check {}
	/*dot*/
	.li-dot {}
	.li-dot::before {}
	.li-dot:not(:last-child) {}
	/*square*/
	.li-square {}
	.li-square::before {}
	.li-square:not(:last-child) {}
	/*矢印アイコン*/
	/*------------------------------*/
	.flow_arrow {}

	
	
}


/*================================
TABLET縦 834px～0px
================================*/
@media (max-width: 834px) {

	/* 横スクロール
	================================*/
	.tab-scroll {
		overflow-x: scroll;
		position: relative;
		z-index: 1;
	}
	.scroll_text {
		text-align: center;
	}
	.scroll_text .word {
		position: relative;
		z-index: 1;
		display: inline-block;
		padding-right: 20px;
		padding-bottom: 0.2em;
		font-size: 2rem;
		line-height: 1;
		color: #856d53;
	}
	.scroll_text .word::after {
		position: absolute;
		content: "";
		right: 0;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		border-left: 8px solid #39b54a;
		border-top: 5px solid transparent;
		border-bottom: 5px solid transparent;
	}
	

	/*================================
	コンテナ類、幅制御
	===============================*/
	.main {}
	.section {}
	.section .inner {
		padding-left: 40px;
		padding-right: 40px;
	}
	.content {}
	.content:not(:last-child) {}

	/*================================
	メインビジュアル
	===============================*/

	/* 見出し
	================================*/
	/*section_title*/
	/*-----------------------------*/
	.section_title {}
	.section_title .main-text {}
	.section_title .en {}
	/*content_title*/
	/*-----------------------------*/
	.content_title01 {}
	.content_title02 {}
	/*item_title*/
	/*-----------------------------*/
	.item_title01 {}
	.item_title02 {}
	.item_title03 {}
	.item_title04 {}

	/* フレーム
	================================*/
	/*padding*/
	.frame-pd20,
	.frame-pd30 {
		padding: 20px;
	}
	.frame-pd40,
	.frame-pd50 {
		padding: 30px;
	}
	/*border*/
	[class*="frame-"].-border01 {}
	/*shadow*/
	[class*="frame-"].-shadow01 {}

	/* チェックリストなど
	================================*/
	/*check*/
	.li-check {}
	/*dot*/
	.li-dot {}
	.li-dot::before {}
	.li-dot:not(:last-child) {}
	/*square*/
	.li-square {}
	.li-square::before {}
	.li-square:not(:last-child) {}
	/*矢印アイコン*/
	/*------------------------------*/
	.flow_arrow {}



}



/*================================
SP表示 667px～0px
================================*/
@media (max-width: 667px) {

	/* 横スクロール
	================================*/
	.sp-scroll {
		overflow-x: scroll;
		position: relative;
		z-index: 1;
	}


	/*================================
	コンテナ類、幅制御
	===============================*/
	.main {}
	.section {}
	.section .inner {
		padding-left: 20px;
		padding-right: 20px;
	}
	.content {}
	.content:not(:last-child) {}

	/*================================
	メインビジュアル
	===============================*/

	/* 見出し
	================================*/
	/*section_title*/
	/*-----------------------------*/
	.section_title {}
	.section_title .main-text {
		font-size: 3.6rem;
	}
	.section_title .en {}
	/*content_title*/
	/*-----------------------------*/
	.content_title01 {
		font-size: 3.2rem;
	}
	.content_title02 {
		font-size: 2.6rem;
	}
	/*item_title*/
	/*-----------------------------*/
	.item_title01 {}
	.item_title02 {}
	.item_title03 {}
	.item_title04 {}
	.item_title05 {}

	/* フレーム
	================================*/
	/*padding*/
	.frame-pd20,
	.frame-pd30,
	.frame-pd40,
	.frame-pd50 {
		padding: 16px;
	}
	/*border*/
	[class*="frame-"].-border01 {}
	/*shadow*/
	[class*="frame-"].-shadow01 {
		box-shadow: 10px 10px #fce952;
	}

	/* チェックリストなど
	================================*/
	/*check*/
	.li-check {}
	/*dot*/
	.li-dot {}
	.li-dot::before {}
	.li-dot:not(:last-child) {}
	/*square*/
	.li-square {
		font-size: 2rem;
	}
	.li-square::before {}
	.li-square:not(:last-child) {}
	/*矢印アイコン*/
	/*------------------------------*/
	.flow_arrow {}




}