@charset "utf-8";

.support_wrap .nb {display:block;}

.free_first {width:100%; height:100vh; display:flex; justify-content:center; align-items:center; position: relative; overflow: hidden;}
.free_first_back {background:url("../image/support/bg_free1.jpg") top center no-repeat #ccc; background-size:cover; position:absolute; left:0; right:0; top:0; bottom:0; width:100%; z-index:-1;}
.free_first .imgbox {width:100%; overflow:hidden; margin:0 auto 12px;}
.free_first .imgbox span {display:block; float:left; width:50%; box-sizing:border-box;}
.free_first .imgbox span:first-child {padding-left:20px;}
.free_first .imgbox span:last-child {text-align:right; padding-right:20px;}

.free_first .imgbox span img {max-width:90%;}
.free_first .txtbox {width:80vw; max-width:470px; padding:50px; padding-bottom:80px; box-sizing:border-box; margin:0 auto; background:rgba(255,255,255,.5); color:#000; text-align:center; position:relative;}
.free_first .txtbox::before {content:''; display:block; position:absolute; top:50%; left:50%; width:92%; height:92%; transform:translateX(-50%) translateY(-50%); border:2px solid #fff;}
.free_first .txtbox span {display:block; letter-spacing:4px; font-size:14px; font-weight:600;}
.free_first .txtbox strong {display:block; margin:40px 0 100px; font-size:30px; line-height:130%;}
.free_first .txtbox p {font-size:24px; line-height:150%;}
.free_first .txtbox p em {font-weight:600;}
@media screen and (max-width: 1024px) {
	.free_first .txtbox {padding:40px 20px;}
	.free_first .txtbox span {font-size:13px;}
	.free_first .txtbox strong {margin:20px 0 30px; font-size:24px;}
	.free_first .txtbox p {font-size:20px; font-weight:300;}
	.free_first .txtbox p em {font-weight:400;}
}
@media screen and (max-width: 768px) {
	.free_first {background-position:65% 0;}
}
@media screen and (max-width: 414px) {
	.free_first .txtbox span {font-size:12px;}
	.free_first .txtbox strong {margin:10px 0 20px; font-size:20px;}
	.free_first .txtbox p {font-size:16px;}
}

.free_second {width:92%; max-width:1200px; padding:40px 0; margin:0 auto; text-align:center; color:#000; position:relative;}
.free_second::before {content:''; position:absolute; top:-119px; left:50%; transform:translateX(-50%); border:60px solid transparent; border-bottom-color:#fff;}
.free_second h4 {display:inline-block; font-size:32px; margin-bottom:10px; border-top:1px solid; border-bottom:1px solid; padding:10px 0 6px;}
.free_second ol {width:100%; display:flex; flex-wrap:wrap; align-items:stretch;}
.free_second ol li {width:33.3333%; padding:0 10px; margin-top:20px; box-sizing:border-box; line-height:140%; font-size:14px;}
.free_second ol li .imgbox {width:150px; height:150px; margin:0 auto; border-radius:100%; background:#e9e9e9; margin-bottom:20px;}
.free_second ol li .imgbox img {max-width:100%;}
.free_second ol li strong {display:block; font-size:18px; font-weight:600; margin-bottom:10px;}
.free_second ol li .nb {display:block;}
@media screen and (max-width: 480px) {
	.free_second::before {top:-80px; border-width:40px;}
	.free_second h4 {font-size:24px;}
	.free_second ol li {width:50%; margin-top:30px; word-break:keep-all;}
	.free_second ol li .imgbox {width:120px; height:120px;}
	.free_second ol li strong {font-size:16px;}
	.free_second ol li .nb {display:inline;}
}


.free_three {width:100%; padding-bottom:36px; background:url("../image/support/bg_free3.jpg") top center no-repeat #ccc; background-size:cover; color:#000;}
.free_three h4 {padding:100px 0 90px; font-size:32px; font-weight:600; text-align:center;}
.free_three .half {width:92%; max-width:720px; margin:0 auto; overflow:hidden; font-size:24px; display:flex; align-items:stretch;}
.free_three .left {float:left; width:50%;}
.free_three .left ul li {position:relative; padding-left:50px; margin-bottom:40px;}
.free_three .left ul li strong {display:block; line-height:140%; margin-bottom:8px;}
.free_three .left ul li em {position:absolute; top:6px; left:0;}
.free_three .left ul li .nb {display:block;}
.free_three .right {float:right; width:50%; font-weight:600; display:flex; justify-content:center; align-items:center;}
.free_three .right p i {display:inline-block; margin-right:30px; position:relative; width:16px; height:30px; vertical-align:middle;}
.free_three .right p i::before {content:''; display:block; width:20px; height:2px; background:#000; position:absolute; top:7px; right:-2px; transform:rotate(50deg);}
.free_three .right p i::after {content:''; display:block; width:20px; height:2px; background:#000; position:absolute; top:21px; right:-2px; transform:rotate(-50deg);}
.free_three .center {width:92%; max-width:720px; margin:0 auto;}
.free_three .center .red {display:block; text-align:right; margin-bottom:6px; font-size:20px;}
.free_three .center dl {width:100%; background:rgba(255,255,255,.6);}
.free_three .center dl dt {width:100%; padding:36px 0; font-size:28px; text-align:center;}
.free_three .center dl dd {width:100%; padding:0 36px 24px 56px; box-sizing:border-box; font-size:20px; line-height:140%; position:relative;}
.free_three .center dl dd::before {content:'+'; position:absolute; top:2px; left:36px;}
.free_three .center dl dd .nb {display:block;}
@media screen and (max-width: 640px) {
	.free_three h4 {font-size:24px; padding:60px 0 40px;}
	.free_three .half {width:86%; font-size:16px;}
	.free_three .left ul li {padding-left:30px; margin-bottom:12px;}
	.free_three .left ul li em {top:2px;}
}
@media screen and (max-width: 480px) {
	.free_three h4 {font-size:20px; padding:40px 0 20px;}
	.free_three .half {font-size:15px;}
	.free_three .left ul li {padding:0;}
	.free_three .left ul li em {display:none;}
	.free_three .right p {text-align:right;}
	.free_three .right p .nb {display:block;}
	.free_three .center .red {font-size:16px; margin-bottom:12px;}
	.free_three .center dl dt {font-size:24px; padding:36px 0 20px;}
	.free_three .center dl dd {font-size:15px; padding:0 12px 12px 36px; word-break:keep-all;}
	.free_three .center dl dd::before {left:20px;}
}


.free_four {width:100%; text-align:center; color:#000;}
.free_four h4 {display:inline-block; font-size:32px; margin-top:40px; border-top:1px solid; border-bottom:1px solid; padding:10px 0 6px;}
.free_four ul {width:100%; max-width:1200px; margin:60px auto; display:flex; flex-wrap:wrap; align-items:stretch;}
.free_four ul li {width:50%; padding:0 20px; border-left:2px solid #e0e0e0; box-sizing:border-box; line-height:140%;}
.free_four ul li:first-child {border:0;}
.free_four ul li .imgbox {margin-bottom:30px;}
.free_four ul li strong {display:block; margin-bottom:10px; font-weight:600;}
.free_four ul li .nb {display:block;}
@media screen and (max-width: 800px) {
	.free_four ul li {word-break:keep-all; font-size:16px;}
	.free_four ul li .nb {display:inline;}
}
@media screen and (max-width: 640px) {
	.free_four ul {width:92%; margin:20px auto;}
	.free_four ul li {width:100%; margin:0 auto; float:none; border:0; padding:30px 0; border-top:2px solid #e0e0e0; font-size:15px;}
}


.free_five {width:100%; padding:60px 10px; box-sizing:border-box; text-align:center; background:url("../image/support/bg_free5.jpg") top center no-repeat #ccc; background-size:cover;}
.free_five p {font-size:22px; font-weight:300; line-height:150%; color:#fff;}
.free_five p::after {content:''; display:block; padding-bottom:20px; margin:8px auto 0; width:0; height:0; border:20px solid transparent; border-left-width:12px; border-right-width:12px; border-bottom:0; border-top-color:#fff;}
.free_five .nb {display:block;}
.free_five a.btn {display:block; width:240px; margin:0 auto; height:46px; line-height:46px; text-align:center; border-radius:23px; font-size:20px; color:#fff; background:#111;}
@media screen and (max-width: 768px) {
	.free_five p{font-size:18px;}
}
@media screen and (max-width: 480px) {
	.free_five p{font-size:16px;}
}