/****リセットcss****/
html{-webkit-text-size-adjust:100%;box-sizing:border-box;-moz-tab-size:4;tab-size:4;word-break:normal}*,:after,:before{background-repeat:no-repeat;box-sizing:inherit}:after,:before{text-decoration:inherit;vertical-align:inherit}*{margin:0;padding:0}hr{color:inherit;height:0;overflow:visible}details,main{display:block}summary{display:list-item}small{font-size:80%}[hidden]{display:none}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}a{background-color:transparent}a:active,a:hover{outline-width:0}code,kbd,pre,samp{font-family:monospace,monospace}pre{font-size:1em}b,strong{font-weight:bolder}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-color:inherit;text-indent:0}iframe{border-style:none}input{border-radius:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}textarea{overflow:auto;resize:vertical}button,input,optgroup,select,textarea{font:inherit}optgroup{font-weight:700}button{overflow:visible}button,select{text-transform:none}[role=button],[type=button],[type=reset],[type=submit],button{cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button:-moz-focusring{outline:1px dotted ButtonText}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}button,input,select,textarea{background-color:transparent;border-style:none}a:focus,button:focus,input:focus,select:focus,textarea:focus{outline-width:0}select{-moz-appearance:none;-webkit-appearance:none}select::-ms-expand{display:none}select::-ms-value{color:currentColor}legend{border:0;color:inherit;display:table;max-width:100%;white-space:normal}::-webkit-file-upload-button{-webkit-appearance:button;color:inherit;font:inherit}[disabled]{cursor:default}img{border-style:none}progress{vertical-align:baseline}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true]{cursor:default}
/******************/

@charset "UTF-8";

@font-face {
	font-family: "Noto Sans JP";
	src: url("/fonts/NotoSansJP-VariableFont_wght.woff2")format("woff2-variations");
	font-weight: 100 900;
	font-style: normal;
}

html {
	font-size: 100%;
}

body {
	/*背景色を入力*/
	background-color: #222;
	/*フォントを入力*/
	font-family: 'Noto Sans JP', sans-serif;
	/*フォントウェイトを入力*/
	font-weight: 500;
  	font-style: normal;
  	/*文字色を入力*/
  	color: #282D49;
  	text-align: center;
}

main {
	/*ヘッダーの幅分下げる*/
	/*margin-top: 70px;*/
}

img {
	display: block;
	max-width: 100%;
}

a {
	text-decoration: none;
	display: block;
	/*ボタン要素などには必要に応じてline-height: 0;を充てる*/
}

li {
	list-style: none;
}

.fullwide {
	max-width: 420px;
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
}

.wrapper {
	max-width: 420px;
    padding: 50px 0;
	margin: 0 auto;
	overflow: hidden;
}

header {
	max-width: 420px;
	margin: 0 auto;
	background-color: #282D49;
	height: 100px;
}

header nav ul {
    display: flex;
    justify-content: center;
    align-items: center;
}

header nav li {
    width: 70%;
    margin: 0 auto;
    padding: 1em;
}

.sec1-back {
	background: url(../img/SP_02_kumo.webp) no-repeat;
	background-size: cover;
	background-position: bottom;
}

#sec1 {
	color: #fff;
}

#sec1 h2 {
	display: block;
    width: 90%;
    margin: 0 auto;
    border-bottom: 2px solid #fff;
}

.list {
	display: flex;
	justify-content: center;
	width: 61%;
	margin: 2em auto;
}

.list ul {
	text-align: initial;
}

.list li {
	list-style: disc;
	color: #FFB325;
}

.list li span {
	color: #fff;
}

.list li::marker {
	font-size: 1.5em;
	line-height: 1;
}

.sec-com {
	width: 88%;
    margin: 0 auto;
    font-size: 1em;
    font-weight: 600;
}

.com1 {
	background-color: #282D49;
    margin: 0 auto 60px auto;
}

.sec2-back {
	background-color: #fff;
}

#sec2 h2 {
	display: block;
	width: 80%;
	margin: 0 auto;
	border-bottom: 10px solid #FFB325;
	line-height: 5px;
}

#sec2 h2 span:nth-of-type(1) {
	line-height: 50px;
}

#sec2 h2 span {
	font-size: 0.7em;
}

#sec2 > p {
	display: block;
	width: 80%;
	margin: 2em auto;
	font-size: 1.1em;
}

.com2 {
	background-color: #ADB9FF;
}

.sec3-back {
	background-color: #fff;
}

.sec4-back {
	background-color: #282D49;
}

#sec4 h2 {
	color: #fff;
}

.items {
	margin-bottom: 2em;
}

.item {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	margin: 1em 2em;
	padding: 0.5em;
	border-radius: 10px;
}

.item img {
	width: 30%;
    padding: 1em;
}

.item-text {
	text-align: initial;
}

.item-text h3 {
	font-size: 1em;
}

.item-text p {
	font-size: 0.9em;
}

.com4 {
	background-color: #D8DCF0;
	font-size: 1em;
	font-weight: 500;
	width: 90%;
}

.com4 p {
	position: relative;
	padding-left: 1.2em;
}

.com4 p:before {
	position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    background: url(../img/SP_04_bikkuri.webp) no-repeat;
    background-size: contain;
    background-position: center;
    top: 0;
    left: 1%;
}

.sec5-back {
	background-color: #fff;
}

.steps {
	text-align: initial;
}

.step {
	display: flex;
	align-items: center;
}

.circle {
    background-color: #282D49;
    color: #fff;
    padding: 1.7em 1em;
    margin: 1em;
    border-radius: 200px;
}

.step-line {
    display: inline-flex;
    margin: 0px 0 0 2.5em;
    transform: rotate(90deg);
    width: 30px;
    border: 5px solid #ADB9FF;
    border-radius: 10px;
}

.step-text {
    padding: 0 1em 0 0;
}

.form-back {
	background-color: #282D49;
}

#form h2 {
	display: block;
	width: 60%;
	margin: 0 auto;
	color: #fff;
	border-bottom: 6px solid #FFB325;
	line-height: 15px;
}

form {
	background-color: #fff;
	padding: 0 15px 30px;
	margin: 30px 20px;
	border-radius: 10px;
	color: #000;
}

form p {
	font-size: 0.8em;
	font-weight: 600;
}

form span p {
	font-size: 0.6em;
}

form dl {
	text-align: initial;
}

form dt {
	font-weight: 600;
	font-size: 1.1em;
}

form dd {
	background-color: #D9D9D9;
	margin: 0 1em 1em;
	border-radius: 5px;
	padding: 0.5em;
}

input {
	width: 100%;
}

textarea {
	width: 100%;
}

label.hissu {
	position: relative;
}

label.hissu:after {
	position: absolute;
	content: '';
	width: 25px;
	height: 25px;
	background: url(../img/SP_form_hissu.webp) no-repeat;
	background-size: contain;
	background-position: center;
}

label.ninni {
	position: relative;
}

label.ninni:after {
	position: absolute;
	content: '';
	width: 25px;
	height: 25px;
	background: url(../img/SP_form_ninni.webp) no-repeat;
	background-size: contain;
	background-position: center;
}

.privacy-policy span {
	display: block;
	text-align: initial;
	font-size: 1.1em;
	font-weight: 600;
}

.privacy-policy div {
	text-align: initial;
	padding: 0.5em;
    margin: 2% 5% 2%;
    border: 1px solid #000;
    font-size: 14px;
    max-height: 100px;
    overflow-y: scroll;
    background-color: #F2F2F2;
}

.privacy-policy h3 {
	margin-top: 1em;
	font-size: 1em;
}

.privacy-policy h3:nth-of-type(1) {
	margin-top: 0;
}

.privacy-policy div ul {
    padding-left: 1.5em;
}

.privacy-policy div ul li {
	list-style: disc;
}

.privacy-policy div a {
	display: inline-block;
}

form > input {
    width: 5%;
}

button {
	color: #fff;
	font-size: 1.1em;
	font-weight: 600;
	background-color: #FFB325;
	padding: 1em 3em;
	margin: 1em 0;
	border-radius: 10px;
    box-shadow: 1px 3px 0 #916718;
}

footer {
	background-color: #fff;
	max-width: 420px;
	margin: 0 auto;
	padding: 1em 0;
	font-size: 0.7em;
}

footer h2 {
	font-size: 1em;
	font-weight: 500;
}

footer dl {
	display: flex;
	flex-wrap: wrap;
	text-align: initial;
	padding: 1em 2em;
}

footer dt {
	width: 35%;
}

footer dd {
	width: 65%;
}

footer dd a {
	display: inline-block;
	color: #282D49;
	border-bottom: 1px solid #282D49;
}

.cta {
	/*display: none;*/
	position: fixed;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    z-index: 999;
    width: 75%;
}

.error-msg {
	display: block;
	color: #ff0000;
}

#popup-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.4);
	z-index: 9998;
}

#popup {
	display: none;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	width: min(92vw,410px);
	z-index: 9999;
}

.popup-close-wrap {
	padding: 0 20px;
	display: flex;
	gap: 8px;
	justify-content: flex-end;
}

#popup-close {
    color: #444c7d;
	padding: 3px 8px;
	border: 3px solid #ddd;
	background: #fff;
	border-radius: 25px;
	cursor: pointer;
}

#popup img {
	position: relative;
}

/*サンクスページ*/
.thanks1-back, .thanks2-back {
	background-color: #fff;
}

#thanks2 {
	padding: 2em 0 3em;
}

#thanks2 h2, #thanks2 h3 {
	color: #444C7B;
}

#thanks2 h3 span {
	font-size: 0.8em;
}

#thanks2 p {
	font-weight: 600;
}

.thanks2-item {
	padding: 2em 1em;
}

.thanks2-item dl {
	display: flex;
	flex-wrap: wrap;
	border-radius: 10px;
	border: 1px solid #282D49;
}

.thanks2-item dt {
	width: 30%;
	color: #fff;
	background-color: #444C7B;
	border-radius: 10px 0 0 0;
	border-bottom: 1px solid #282D49;
	padding: 0.5em;
}

.thanks2-item dt:nth-of-type(2) {
	border-radius: 0 0 0 10px;
	border-bottom: none;
}

.thanks2-item dd {
	width: 70%;
	border-bottom: 1px solid #282D49;
	padding: 0.5em;
	font-size: 0.9em;
}

.thanks2-item dd:nth-of-type(2) {
	border-bottom: none;
}

.atn {
	font-size: 0.8em;
}

.thanks-btn {
	color: #282D49;
	background-color: #ADB9FF;
	box-shadow: 1px 3px 0 #282D49;
}

.footer {
	background-color: #282D49;
	color: #fff;
	padding-top: 2em;
}

@media screen and (max-width: 1024px) {


}



@media screen and (max-width: 767px) {

	
}