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

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - 
　◆ Stracture
　◆ margin padding
- - - - - - - - - - - - - - - - - - - - - - - - - - - */
:root{
	--mainColorBlk:#222;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - 
　Stracture
- - - - - - - - - - - - - - - - - - - - - - - - - - - */
*{
	max-width: 100%;
}

body{
	margin:0;
	font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-size: 3.74vw;
	background: #aed1ee;
	letter-spacing: 0.075em;
}

img{
	vertical-align:bottom;
	border:none
}

h1,h2,h3,h4,dl,dt,dd{
	margin:0;
	padding:0
}

ul,li{
	list-style:none;
	padding:0;
	margin:0
}

section{
}

header{
}

main{
	max-width: 980px;
	margin: 0 auto;
	background: #FFF;
}

p{
	margin:0;
	padding:0
}


header{
	width: 100%;
	height: 118vw;
	background: url(../images/keybg.jpg) top center no-repeat;
	background-size: 100%;
	position: relative;
}

header a{
	bottom: 8.54vw;
	width: 100%;
	display: block;
	position: absolute;
}

#feature, #faq{
	padding: 12vw 0 18.67vw;
}

#feature p{
	width: 76.8vw;
	margin: 11.74vw auto;
}

#faq{
	background: #018684;
}

.faqList{
	width: 86.67vw;
	margin: 12.67vw auto 0;
}

.faqList li{
	background: #FFF;
	border-radius: 1.34vw;
}

.faqList li:not(:last-child){
	margin-bottom: 5.6vw;
}

.faqList dl{
	width: 74.67vw;
	margin: 0 auto;
	letter-spacing: 0;
}

.faqList dt{
	padding: 6.14vw 0 4.94vw 0.67vw;
	border-bottom: 1px solid #cfcfcf;
	color: #017e7c;
	font-weight: 600;
}

.faqList dd{
	padding: 4.94vw 0 6.14vw 0.67vw;
}

footer{
	padding: 12.8vw 0 10.4vw;
	color: #FFF;
	background: #333;
	text-align: center;
	z-index: 11;
	position: relative;
}

footer a{
	width: 82.67vw;
	padding: 4.8vw 0 4.8vw 6vw ;
	margin: 5.34vw auto;
	border-radius: 1.07vw;
	border: 1px solid #FFF;
	color: #FFF;
	display: block;
	text-decoration: none;
	box-sizing: border-box;
	background: url("../images/line_w.png") no-repeat;
	background-position: top 4.54vw left 19.07vw;
	background-size: 6.14vw;
}

footer .copy{
	font-size: 2.94vw;
	margin: 20.8vw auto 0;
}

footer .copy img{
	width: 19.2vw;
	margin-bottom: 2.94vw;
}

#bottomcta{
	position: fixed;
	bottom: 0;
	background: rgba(255,91,126,0.9);
	width: 100%;
	padding: 2.14vw 0 1.87vw;
	box-sizing: border-box;
	color: #FFF;
	animation: cmp 14s both;
	animation-delay: 10s;
	z-index: 10;
}

#bottomcta a{
	display: block;
	max-width: 980px;
	margin: 0 auto;
}

@keyframes cmp {
    0% {
        opacity:0;
		transform: translateY(90%)
    }
    16%,100% {
        opacity:1;
		transform: translateY(0)
    }
}




/*-------------------------------------------------------------------
	min-width:980px
-------------------------------------------------------------------*/
@media screen and (min-width:980px) {
	body{
		font-size: 37px;
	}
	
	header{
		height: 1158px;/*1772 / 1.530224525043178*/
	}
	
	header a{
		bottom: 84px;/*64 * 2  / 1.530224525043178*/
	}
	
	#feature, #faq{
		padding: 118px 0 183px;
	}

	#feature p{
		width: 756px;
		margin: 115px auto;
	}
	
	.faqList{
		width: 850px;
		margin: 124px auto 0;
	}
	
	.faqList li{
		border-radius: 13px;
	}

	.faqList li:not(:last-child){
		margin-bottom: 55px;
	}
	
	.faqList dl{
		width: 732px;
		margin: 0 auto;
	}
	
	.faqList dt{
		padding: 50px 0 38px 7px;
	}
	
	.faqList dd{
		padding: 38px 0 50px 7px;
	}	

	footer{
		padding: 125px 0 102px;
	}

	footer a{
		width: 850px;
		padding: 47px 0 47px 59px ;
		margin: 52px auto;
		border-radius: 10px;
		background-position: top 44px left 187px;
		background-size: 60px;
	}

	footer .copy{
		font-size: 22px;
		margin: 20.8vw auto 0;
	}

	footer .copy img{
		width: 188px;
		margin-bottom: 29px;
	}
	

	#bottomcta{
		padding: 20px 0;
	}

	#bottomcta a{
		width: 520px;
	}

	
}
















/*-------------------------------------------------------------------
	max-width:979px
-------------------------------------------------------------------*/
@media screen and (max-width:979px) {

}