@charset "utf-8";

:root {
	--i_color: #1344B5;
	--i_color2: #FF8D15;
	--linear_color: linear-gradient(to right, #42ADE0, #0D53C7);
	--header_height:.9rem;
}
@media screen and (max-width:1024px) {
	:root {
		--header_height: 60px;
	}
}



.mainDetection{width: 100%; max-width: 750px; min-height: 100vh; margin-left: auto; margin-right: auto;}
.wrapDetection{width: 92%; margin-left: auto;margin-right: auto;}

.homeBanner{position: relative;}
.homeBanner>img{width: 100%;}

.homeBanner_txt{position:absolute; top:50%; transform:translate(0,-50%); left: 40px;}
.homeBanner_txt h1{font-size: 42px; color: #FFF; line-height: 1.5;}
.homeBanner_txt h1 span{font-size: 52px;}
.homeBanner_txt h1 i{color: var(--i_color2);}

.homeBanner_txt dl{margin-top: 30px;}
.homeBanner_txt dt{padding-left: 44px; margin: 20px 0; font-size: 22px; color: #FFF; position: relative;}
.homeBanner_txt dt::before{content: ''; position:absolute; top:50%; transform:translate(0,-50%); left: 0; width: 30px; height: 30px; background:url(../images/ok.webp) no-repeat; background-size: contain;}

.homeBanner_pic{position:absolute; top:50%; transform:translate(0,-50%); right: 10px; width: 51.067%; z-index: 3;}
.homeBanner_pic img{width: 100%;}

@media screen and (max-width:768px) {
	.homeBanner_txt{left: 4vw;}
	.homeBanner_txt h1{font-size: 5.5vw;}
	.homeBanner_txt h1 span{font-size: 7vw;}
	.homeBanner_txt dl{margin-top: 3vw;}
	.homeBanner_txt dt{padding-left: 6vw; font-size: 3vw;}
	.homeBanner_txt dt::before{width: 4vw; height: 4vw;}
}
@media screen and (max-width:560px) {
	.homeBanner_txt dt{margin: 16px 0;}
}





.detForm_box{margin-top: -90px; background: #FFF; box-sizing: border-box; padding: 40px 30px; position: relative; border-radius:16px; z-index: 2;}

.detForm{--input_fontsize:26px}
.detForm .item{padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #DDD; display:flex; flex-wrap:nowrap; align-items: center; gap: 0 20px;}
.detForm .item label{flex-shrink: 0; font-size: var(--input_fontsize); color: #444; line-height: 1.2; position: relative; top: -2px;}
.detForm .item input{width: 100%; font-size: var(--input_fontsize) !important; color: #444 !important; line-height: 1.2 !important; margin: 0 !important; padding: 0 !important; border: none !important; border-radius:0 !important;}
.detForm .item input::-webkit-input-placeholder {color: #AAA;font-size: var(--input_fontsize)}
.detForm .item input::-moz-placeholder {color: #AAA;font-size: var(--input_fontsize)}
.detForm .item input:-moz-placeholder {color: #AAA;font-size: var(--input_fontsize)}
.detForm .item input:-ms-input-placeholder {color: #AAA;font-size: var(--input_fontsize)}

.detForm_checkbox{display:flex; flex-wrap:wrap; gap: 10px 10px;}
.detForm_checkbox dt{background: #F4F4F4; border-radius:6px; cursor: pointer; position: relative; overflow: hidden;}
.detForm_checkbox dt::before{opacity: 0; content: ''; position: absolute; right: 0; bottom: -18px; width: 25px; height: 16px; background:url(../images/check.webp) no-repeat right bottom; background-size: contain; transition:all .2s ease;}
.detForm_checkbox dt p{padding: 12px 20px; font-size: 18px; position: relative;}
.detForm_checkbox dt.active{background: #E7ECF7;}
.detForm_checkbox dt.active::before{opacity: 1; bottom: 0;}

#wpforms-369{margin:0 !important; padding:0 !important}
#wpforms-369-header-error{display: none !important;}
.wpforms-field-container>.wpforms-field{padding: 0 0 !important; margin: 0 0 !important; overflow-x:initial !important}
.wpforms-field-container>.wpforms-field .wpforms-field-label{display: none !important;}
.wpforms-field-container>.wpforms-field>input{display: none !important;}
.wpforms-field-container>.wpforms-field>fieldset{display: none !important;}
.wpforms-field-container>.wpforms-field .wpforms-error{position: absolute !important; bottom: 3px !important; margin:0 !important; padding:0 !important}

#wpforms-369 .wpforms-submit-container{width: 100%; margin: 0 auto; padding:0 0; position: relative; border-radius:10px; cursor: pointer; overflow: hidden;}
#wpforms-369 .wpforms-submit-container button{width: 100%; height: auto !important; padding: 24px 20px; font-size: 26px; cursor: pointer; color: #FFF; background:linear-gradient(to bottom, #FFA115, #FF8609);}
#wpforms-369 .wpforms-submit-container img{position:absolute;top:50%;transform:translate(0,-50%);right:4px;z-index:2}
/* #wpforms-369 .wpforms-submit-container button:hover{background: var(--i_color);} */

/* .detForm_btn{width: 100%; background:linear-gradient(to bottom, #FFA115, #FF8609); text-align: center; border-radius:6px; cursor: pointer;}
.detForm_btn p{padding: 24px 20px; font-size: 26px; color: #FFF;} */

.detForm_py{margin-top: 20px; display:flex; flex-wrap:wrap; align-items: center; gap: 0 10px; font-size: 20px;}
.detForm_py i{display: block; width: 28px; height: 28px; box-sizing: border-box; border: 1px solid #AAA; border-radius:50%; cursor: pointer; overflow: hidden; -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none;}
.detForm_py i.active{background:url(../images/ok_form.webp) no-repeat center; background-size: 30px; border-color: var(--i_color);}
.detForm_py a{color: var(--i_color);}
.detForm_py a:hover{text-decoration: underline;}

.detForm_tip{}
.detForm_tip .tit{padding-left: 36px; display:flex; flex-wrap:wrap; align-items: center; position: relative;}
.detForm_tip .tit i{position:absolute; top:50%; transform:translate(0,-50%); left: 0; width: 26px; height: 26px; background:url(../images/tips.webp) no-repeat center; background-size: contain;}
.detForm_tip .tit h6{font-size: 20px;}
.detForm_tip ul{margin-top: 16px; padding-left: 36px; }
.detForm_tip li{margin: 6px 0; padding-left: 10px; font-size: 18px; color: #888; line-height: 1.5; position: relative;}
.detForm_tip li::before{content: ''; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; background: #CCC; border-radius:50%;}

@media screen and (max-width:768px) {
	.detForm{--input_fontsize:20px}

	.detForm_box{margin-top: -12vw;}
	.detForm .item{padding-bottom: 4vw; margin-bottom: 4vw;}

	.detForm_checkbox dt p{padding: 1.5vw 2vw; font-size: 2.5vw;}

	#wpforms-369 .wpforms-submit-container button{padding: 3vw 2vw; font-size: 3.6vw;}

	.detForm_py{font-size: 2.8vw;}
	.detForm_py i{width: 22px; height: 22px;}

	.detForm_tip .tit{padding-left: 6vw;}
	.detForm_tip .tit i{width: 4vw; height: 4vw}
	.detForm_tip .tit h6{font-size: 3.8vw;}
	.detForm_tip ul{padding-left: 6vw;}
	.detForm_tip li{font-size: 3vw;}
	.detForm_tip li::before{top: 2.1vw;}
}
@media screen and (max-width:560px) {
	.detForm{--input_fontsize:16px}

	.detForm_box{padding: 30px 20px;}
	.detForm .item label{top: 0;}
	.detForm_checkbox dt p{padding: 10px 2.5vw; font-size: 14px;}
	.detForm_checkbox dt::before{width: 14px; height: 10px;}

    .fCheckbox{flex-wrap: wrap !important;}
	#wpforms-369 .wpforms-submit-container button{padding: 3.5vw 2vw; font-size: 18px;}

	.detForm_py{font-size: 15px; gap: 0 4px;}
	.detForm_py i{margin-right: 5px; width: 18px; height: 18px;}
	.detForm_py i.active{background-size: 22px;}

	.detForm_tip li{font-size: 14px;}
	.detForm_tip li::before{top: 8px;}
}




.detTit{display:flex; flex-wrap:nowrap; align-items: center; justify-content: center; gap: 0 20px;}
.detTit i{width: 120px; height: 30px;}
.detTit .tit_1{background:url(../images/tit-1.webp) no-repeat center; background-size: contain;}
.detTit .tit_2{background:url(../images/tit-2.webp) no-repeat center; background-size: contain;}
.detTit h3{flex-shrink: 0; font-size: 34px;}
.detTit h3 i{color: var(--i_color);}

.detData_list{display:flex; flex-wrap:wrap; gap: 30px 4%;}
.detData_list li{width: 48%; background: #FFF; box-sizing: border-box; padding: 50px 30px 50px; border-radius:14px; position: relative;}
.detData_list li::before{content: ''; position: absolute; top: 10px; right: 10px; width: 30%; height: 70%;}
.detData_list li:nth-child(1)::before{background:url(../images/i_icon_1.webp) no-repeat top right; background-size: contain;}
.detData_list li:nth-child(2)::before{background:url(../images/i_icon_2.webp) no-repeat top right; background-size: contain;}
.detData_list li:nth-child(3)::before{background:url(../images/i_icon_3.webp) no-repeat top right; background-size: contain;}
.detData_list li:nth-child(4)::before{background:url(../images/i_icon_4.webp) no-repeat top right; background-size: contain;}
.detData_list li:nth-child(5)::before{background:url(../images/i_icon_5.webp) no-repeat top right; background-size: contain;}
.detData_list li:nth-child(6)::before{background:url(../images/i_icon_6.webp) no-repeat top right; background-size: contain;}

.detData_list span{position: relative; z-index: 2;}
.detData_list h3{margin-bottom: 12px; font-size: 32px; color: var(--i_color);}
.detData_list p{font-size: 20px; line-height: 1.6;}

@media screen and (max-width:768px) {
	.detTit h3{font-size: 5vw;}

	.detData_list li{padding: 7vw 4vw 6vw;}
	.detData_list h3{font-size: 4vw;}
	.detData_list p{font-size: 3vw;}
}
@media screen and (max-width:560px) {
	.detData_list{gap: 20px 4%;}
	.detData_list h3{margin-bottom: 20px; font-size: 22px;}
	.detData_list p{font-size: 14px;}
}







.qrBanner{position: relative;}
.qrBanner>img{width: 100%;}

.qrBanner_txt{position: absolute; left: 0; top: 10%; width: 100%; text-align: center;}
.qr_tit{display: block; margin: 0 auto; max-width: 76%;}
.qr_tit_icon{display: block; margin: 30px auto; height: 14px;}

.qrBanner_txt h5{font-size: 34px; color: #FFF;}
.qrBanner_txt h6{margin-top: 10px; font-size: 28px; color: rgb(255 255 255 / 50%);}

.qr_box{margin-top: -56%; position: relative; width: 100%; margin-left: auto; margin-right: auto; z-index: 2;}
.qr_box>img{width: 100%;}

.qr_box .qr{position: absolute; left:50%; transform:translate(-50%,0); transform:translate(-50%,0); width: 43%; bottom: 14%; text-align: center;}
.qr_box .qr img{max-width: 100%;}
.qr_box .qr p{margin-top: 20px; font-size: 24px;}
.qr_box .qr p i{color: var(--i_color2);}

@media screen and (max-width:768px) {
	.qrBanner_txt h5{font-size: 4.5vw;}
	.qrBanner_txt h6{font-size: 3.8vw;}

	.qr_box .qr p{font-size: 3.2vw;}
}
@media screen and (max-width:560px) {
	.qr_box{margin-top: -50%;}
}