@charset "UTF-8";

/* base ---------------------------------------*/
body{
	-webkit-text-size-adjust: 100%;
	padding:0;
	margin: 0;
	font-family:'Noto Sans JP', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
	font-feature-settings: "palt" 1;
	-webkit-font-feature-settings: "palt" 1;
	color: #333;
}

/* swipe ---------------------------------------*/
.swipewrapper { 
	background: #FFFBF1;
}

.swipecontainer { 
	max-width: 540px;
	width: 100%;
	height: 100dvh;
	margin: 0 auto;
	background: #fff;
	overflow-y: scroll;
	scroll-snap-type: y mandatory;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.swipecontainer::-webkit-scrollbar {
	display: none;
}

.swipesection { 
	height: 100dvh;
	scroll-snap-align: start;
}

.swipesection.has-link { 
	position: relative;
}

.swipesection-image { 
	width: 100%;
	height: 100dvh;
}

.swipesection-image img { 
	width: 100%;
}

.swipedots { 
	position: fixed;
	top: 50%;
	left: calc(50% + min(calc(252 / 540 * 100vw), 252px));
	transform: translate(-50%, -50%);
	z-index: 10;
}

.swipedots > li { 
	width: 8px;
	height: 8px;
	background: #F2F4F2;
	border-radius: 50%;
}

.swipedots > li.is-active { 
	background: #E46006;
}

.swipedots > li + li { 
	margin-top: 8px;
}

.swipefixedbtn { 
	position: fixed;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10;
	padding: min(calc(15 / 540 * 100vw), 15px) min(calc(30 / 540 * 100vw), 30px) min(calc(40 / 540 * 100vw), 40px);
	max-width: 540px;
	width: 100%;
	height: min(calc(140 / 540 * 100vw), 140px);
	background: #fff;
}

.btn-text { 
	display: block;
	font-size: min(calc(16 / 540 * 100vw), 16px);
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
	letter-spacing: 0.02em;
	color: #1D832F;
	margin-bottom: min(calc(8 / 540 * 100vw), 8px);
}

.btn { 
	display: inline-block;
	padding: min(calc(16 / 540 * 100vw), 16px) min(calc(16 / 540 * 100vw), 16px)  min(calc(16 / 540 * 100vw), 16px);
	width: min(calc(480 / 540 * 100vw), 480px);
	background: linear-gradient(180deg, #3AA54D 0%, #1D832F 100%);
	border-radius: 70px;
	font-size: min(calc(21 / 540 * 100vw), 21px);
	font-weight: 700;
	line-height: 1.1;
	text-align: center;
	letter-spacing: 0.04em;
	color: #fff;
	box-shadow: 0 6px 0 0 #23641E;
	transition: all .25s ease;
	position: relative;
}

.icon-arrow { 
	display: inline-block;
	width: min(calc(20 / 540 * 100vw), 20px);
	height: min(calc(20 / 540 * 100vw), 20px);
	background: url('../img/icon_arrow.svg') no-repeat center center;
	background-size: contain;
	position: absolute;
	top: 50%;
	right: min(calc(23 / 540 * 100vw), 23px);
	transform: translateY(-50%);
}

.btn .icon-arrow { 
	margin: 0 0 0 min(calc(15 / 540 * 100vw), 15px);
}