@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;900&display=swap');
.w200 { max-width: 200px; width: 100%;border-radius: 30px;}
.w250 { max-width: 250px; width: 100%;border-radius: 30px;}
.w240 { max-width: 240px; width: 100%;}
.w768 { max-width: 768px; width: 100%;margin:0 auto;}

#page-top {position: fixed;bottom: 40px;right: 40px;width: 60px; z-index:400;}
@media screen and (max-width: 896px) {
	#page-top {position: fixed;bottom: 5px;right: 5px;width: 30px; z-index:400;}
}

.slideInup {opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-transform: translateY(60px); -ms-transform: translateY(60px); transform: translateY(60px);}
.slideInup.appear {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}
.fadeIn {opacity: 0; transition: all 1s;}
.fadeIn.appear {opacity: 1;}
.delay01 {transition-delay: .2s;}
.delay02 {transition-delay: .4s;}
.delay03 {transition-delay: .6s;}
.delay04 {transition-delay: .8s;}
.delay05 {transition-delay: 1s;}

@keyframes DownAnime{
  from {opacity: 0; transform: translateY(-100px);}
  to {opacity: 1; transform: translateY(0);}
}

header {width: 100%; background: #000; padding: 15px 30px; position: absolute ;top:0; z-index: 100;}
#under header {box-shadow: 0 3px 6px rgb(0 0 0 / 30%); position: relative; z-index: 100;}

#header h1 {max-width: 200px;}
#header h1 a img{transition: .3s;}
#header h1 a img:hover{opacity: 0.7;}
#header.fixed {position: fixed; top: 0; z-index: 10; padding: 15px 20px; background: rgba(0,0,0,1); animation: DownAnime 0.5s forwards; box-shadow: 0 3px 6px rgb(0 0 0 / 30%);}
#header.fixed h1 {width: 262px;}
.logoImg { /*max-width: 240px;*/}
.navArea{ /*width: calc(100% - 324px - 40px);*/ }
.navR{ width:calc(100% - 200px);}
.navR .gap{ gap:30px;}
.global_menu {/*visibility: hidden;*/ height: 100%; position: fixed; top: 0; left:0; color: #222; /*overflow-y: scroll;*/ text-align: center;}
.global_menu a {display: block; width: 100%; padding: 0 10px; color: #fff; box-shadow: inset 0 0 0 0 #F29500; transition: color .3s ease-in-out, box-shadow .3s ease-in-out;}
.global_menu a:hover { color: #fff; box-shadow: inset 200px 0 0 0 #F29500;}
.global_menu a.externalLink::after {content:""; display: inline-block;width:14px;height:14px;background: url("../img/cmn/link.svg");margin-left: 5px;}
.global_menu a.externalLink:hover::after {background: url("../img/cmn/link_wh.svg");}
#header .cmnBtn {text-align: center; background: #D42426; box-shadow: none; margin: 0 0 0 12px;transition: all 0.3s ease 0s; border-radius: 50px;}
#header .cmnBtn:hover { background:#EE0000;}
#header .cmnBtn2 {display: block; padding: 20px 0; text-align: center; background:#F29500; transition: all 0.3s ease 0s; margin: 0 0 0 15px; border-radius: 50px;}
#header .cmnBtn2:hover {color:white;background:#F29500; }
#header .pcOnly{margin-top: 0;}
#header .hdbtn_01,#header .hdbtn_02{width: 268px; height:70px; display: flex; justify-content: center;gap: 10px; align-items: center; padding: 0 20px;}
#header .hdbtn_01 img,#header .hdbtn_02 img{width: 20px;}
#header .hdbtn_01 p{line-height: 0.8em; text-align: left;margin-top: -10px;}
#header .hdbtn_01:hover{
	background: #EE0000!important;
	color: #fff!important;
}
#header .hdbtn_02:hover{
	background: #F2B900!important;
	color: #fff!important;
}

/*.menu_wrap{ gap: 30px;} */
.menu {font-size: 18px; font-weight: 700; white-space: nowrap;transition:all 1s;}
#hanburger {display: none;}
#hanburger:checked ~ .menu_button {top: 0; right: 0; background: transparent;}
#hanburger:checked ~ .span2 {display: none;}
#hanburger:checked ~ .span1 {width: 32px; transform: rotate(45deg); top: 26px; right: 10px;}
#hanburger:checked ~ .span3 {width: 32px; transform: rotate(-45deg); top: 26px; right: 10px;}
#hanburger:checked ~ .global_menu {visibility: visible;}
#hanburger,.spOnly {display: none;}
.navR .w250 {margin-left: 15px;}
.menu_button {width: 50px; height: 50px; position: fixed; top: 0; right: 0; background: #006AA1; z-index: 15;}
.mailBtn{  width: 50px; height: 50px; line-height:50px; position: fixed; top: 0; right: 50px; z-index: 2; }
.mailBtn img{  width: 18px; height: 18px;     vertical-align: middle;}
@media screen and (max-width: 1080px) {
	header { padding: 30px 15px; }
	.logoImg { max-width: 200px;}
	.navR {  width: calc(100% - 200px);}
	.menu_wrap { gap: 10px;}
}
@media screen and (min-width: 897px) {
  .global_menu {position: inherit; padding: 0; color: #0B4DA0; visibility: visible; overflow-y: visible; height: auto;}
  .menu:hover .child_menu {visibility: visible; top: 81px; opacity: 1;}
  .child_menu {width: 100%; position: absolute; top: 0; left: 0; padding: 10px; color: #FFF; background: #1B2B78; visibility: hidden; opacity: 0; transition: .5s top, .5s opacity; z-index: 10;}
  .child_menu > li {display: inline-block; margin: 0 10px; background: #FFF;}
  .child_menu > li a {padding: 10px 20px; border: 1px solid #FFF; transition: .5s all;}
  .child_menu > li a:hover {background: #1B2B78; color: #FFF;}
  .child_menu > li > ul > li a {padding: 10px; position: relative;}
  .menu_button {display: none;}
}
@media screen and (max-width: 896px) {
  .pcOnly {display: none;}
  #header .spOnly,.spOnly {display: block;}
  header { padding: 10px 15px; height: 60px;}  
  #header h1 {padding: 0; width: initial;}
  .logoImg {max-width: 140px;}
  .drawer__nav .hd_lpbana img{width: 80%; display: block; margin: 10px auto; max-width: 100% !important;}
  span.span1,span.span2,span.span3 {width: 30px; height: 1px; background-color: #FFF; right: 10px; transition: .3s; z-index: 100; position: fixed;}
  .span1 {top: 17px;}
  .span2 {top: 25px;}
  .span3 {top: 33px;}
  #hanburger:checked .global_menu {visibility: hidden;}
  .global_menu {z-index: 10;}
  #header .global_menu .cmnBtn{border:0; background: #FDA500; text-align: center; width: 90%; margin-left: 5%!important;}
  .menu {display: block;}
  .menu > label:hover {cursor: pointer; cursor: hand;}
  .menu input[type="checkbox"]:checked ~ .child_menu {max-height: inherit!important; overflow-y: visible; visibility: visible!important;}
  .menu > a {padding: 15px 20px; text-align: left; border-bottom: 1px solid #FFFFFF; font-weight: 400; }
  .menu:nth-of-type(5) > a {padding: 15px 20px; border-bottom: 0px; text-align: center; font-weight: 700; margin: 3% auto 0; width: 80%; background: #006AA1; border-radius: 50px;}
  .menu:nth-of-type(5)  > a:hover {box-shadow: none;}
  .menu:nth-of-type(6) > a {padding: 15px 20px; border-bottom: 0px; text-align: center; font-weight: 700; margin: 3% auto 0; width: 80%; background: #142C4D; border-radius: 50px;}
  .menu:nth-of-type(6) > a:hover {box-shadow: none;}
  .menu > a span {margin-right: 10px; width: 30px!important;}
  .menu > a span img {width: 100%;}
  .menu .pd {display: inline-block; width: 100%; position: absolute; top: 0; left: 0; height: 100%;}
  .menu .child_menu {border-top: 1px solid #DDD; position: relative; opacity: 1; top: 0; margin-left: auto; left: auto; width: auto;}
  .child_menu li {display: block;}
  .child_menu > li > a,.child_menu > li > ul > li a {padding: 10px 15px; color: #222; text-align: left; border-bottom: 1px dotted #999;}
  .child_menu > li > ul > li a {padding: 15px 20px 15px 35px; position: relative;}
  .child_menu > li > ul > li:last-child a {border-bottom: 1px solid #CCC;}
  .child_menu > li > ul > li a::before {border-top: solid 1px #222; content: ''; left: 20px; position: absolute; top: 50%; width: 10px;}
  .child_menu li {display: block;}
  .menu_wrap {display: none;}
  #hanburger:checked ~ * .menu_wrap {width: 100%; display: block; opacity: 1; min-height: 100vh; background:#67b7e1; position: fixed; top: 0; z-index: 5;}
  #hanburger:checked ~ * .menu {max-height: inherit; overflow-y: visible; padding: 0; margin-left: 0; position: relative;}
	#hanburger:checked ~ * .menu:first-child img{ max-width:158px;} 	
  #hanburger:checked ~ * .menu a { color: white;}
  #hanburger:checked ~ * .child_menu {max-height: 0; overflow-y: hidden; visibility: hidden; text-align: left;}
  #header .hdbtn_01 p{line-height: 1em; margin-top: -3px;}
  #header .hdbtn_02{
	width: 100%; 
	height:auto; 
	padding: 20px;
	border-radius: 50px;
	margin-top: 20px;
	}
	#header .hdbtn_02 a{
		width: 100%;
		height: 100%;
		display: flex; 
		justify-content: center;
		gap: 10px; 
		align-items: center; 
	}
}

footer {background: url(../img/cmn/footerbg.jpg) no-repeat center center; background-size: cover;}
.footerArea {padding: 50px 0 40px 0;}
.footerArea nav {border-bottom: solid 1px white;}
.footerArea nav li {padding: 0 20px; border-right: 1px solid white;}
.footerArea nav li:first-child{padding-left: 0;}
.footerArea nav li:last-child{border-right: 0; padding-right: 0;}
.footerLogo {padding: 45px 0 40px 0;}
.footerLogo {width: 357px; margin: 0 auto;}
.footCopy {text-align: center;}
.footCopy small {font-size: 14px; line-height: 1.2;}
#footer .ft_lpbana{position: fixed; z-index: 5; bottom: 10px; right: 20px;}
#footer .ft_lpbana img{width: 330px; height: auto;transition: 0.3s; filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));}
#footer .ft_lpbana img:hover{opacity: 0.7; filter: none;}

@media screen and (max-width: 568px) {
	footer { background: url(../img/cmn/footerbg_sp.jpg) no-repeat center center; background-size: cover;}
	.footerArea {padding: 40px 0;}
	.footerLogo {border-top: 1px solid #FFF; margin: 0; padding: 30px 0 20px; width: 100%;}
	.footerLogo a {width: 357px; margin: 0 auto;}
	.footerArea nav {font-size: 14px; padding-bottom: 25px; max-width: 315px; margin: 0 auto; border-bottom: none;}
	.footerArea nav li {margin: 0 0 15px 0;}
	.footerArea nav li:first-child {padding-left: 20px; border-left: 1px solid #FFF;}
	.footerArea nav li:nth-child(3),.footerArea nav li:nth-child(5) {border-left: 1px solid #FFF;}
	.footerArea nav li:last-child {border-right: 1px solid #FFF; padding-right: 20px;}
	.footerLogo img { max-width: 203px;}
	.footCopy small {font-size: 10px;}
}

/*------------------------------------------------------

共通

------------------------------------------------------*/
/*-- ボタンホバー --*/
.cmnBtn {display: block; padding: 20px 0; text-align: center; background:#FDA500; transition: all 0.3s ease 0s; margin: 0 auto; border-radius: 50px;}
@media screen and (max-width: 568px) {
	.cmnBtn {padding: 17px 0;}
}

.mt8p{margin-top: 8%;}

/* ------------------------- FV ------------------------- */
#fvarea{
	background-image:url(../img/fv_main_right.png), url(../img/fv_main_left.jpg) ;
	background-repeat: no-repeat, no-repeat;
	background-position: right center, left center;
	background-size: cover, cover;
	padding:80px 0 80px;
}
.inner{
	width: 1200px;
	margin: 0 auto;
	display: block;
}

.inner img{
	width: initial;
	max-width: 100%;
	height: auto;
	}

.fv_box{
	width: 55%;
	display: flex;
	box-sizing: border-box;
	flex-direction: column;
	margin-left: 45%;	
}

#fvarea h2 img{
	width: 100%;
	height: auto;
	margin-right: -65px;
}

.fv_catchbtm{
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	margin: 3% auto 0;
}

.fv_catchbtm div.fv_catchleft{
	width: 57%;
}

.fv_catchbtm_p{
	line-height: 1.5em;
    display: inline-block;
    text-align: left;
    float: right;
    margin: 20px 2.3% 0 0;
    width: auto;
}

.fv_catchbtm div:nth-of-type(2) img{
	width: 250px;
	height: auto;
	margin-bottom: -15px;
}

.hd_btn_pc{
	display: flex;
	justify-content: flex-end;
	margin: 7% 0 0 0;
}

#fvarea_btn{
	width: 100%;
	display: flex;
	justify-content: flex-end;
	margin-top: 20px;
}


#fvarea_btn a{
	display: block;
	border-radius: 60px;
	text-align: center;
	filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
	transition: .3s;
	padding: 0 17px;
}

#fvarea_btn a:hover{
	background: #EE0000;
	color: #fff;
}

#fvarea_btn a span{
	display: flex;
	padding: 20px 50px;
	width: 100%;
	height: auto;
	justify-content: center;
	align-items: center;
}

#fvarea_btn a span i{
	font-size: 18px;
	margin-right: 10px;
	margin-top: 5px;
}

.hd_btn_sp{display: none;}

@media screen and (max-width: 1209px) {
	.inner{
	max-width: 100%;
	padding-right: 4%;
	padding-left: 4%;
	}

	#fvarea{
		background-image:url(../img/fv_main_right_sp.png), url(../img/fv_main_left_sp.jpg) ;
		background-repeat: no-repeat, no-repeat;
		background-position: right bottom, left top;
		background-size: 80% auto, 100% auto;
		padding:55% 0 80px;
	}
	
	.fv_box{
		width: 90%;
		display: flex;
		box-sizing: border-box;
		flex-direction: column;
		margin: 0 auto;	
	}
	
	#fvarea h2 img {
		width: 100%;
		height: auto;
		margin-left: 25px;
	}

	.fv_catchbtm_p {margin: 30px auto;}
	#fvarea_btn a {width: 75%;margin: 20px auto;}
	#fvarea_btn a span{padding: 20px 10px;}
}

@media screen and (max-width: 896px) {
	#fvarea_btn a {width: 100%; font-size: 5vw;}

	.hd_btn_pc{
		display: none;
	}
	.hd_btn_sp{
		display: flex;
		position: fixed;
		z-index: 10;
		bottom: 0;
		right: 0;
		left: 0;
		width: 100vw;
	}
	.hd_btn_sp div{
		width: 100%;
		height: auto;
	}

	.hd_btn_sp .hdbtn_01{
		display: flex; 
		justify-content: center;
		gap: 10px; 
		align-items: center; 
		padding: 0 20px;
	}
	.hd_btn_sp .hdbtn_01 img{width: 20px;}
	.hd_btn_sp .hdbtn_01 p{line-height: 0.8em; text-align: left; display: flex;}
	.hd_btn_sp .hdbtn_01 a{
        display: flex;
        padding: 5% 0;
        gap: 15px;
		justify-content: center;
        align-items: center;
		width: 100%;
		height: 100%;
		color: #fff;
		font-size: 5vw;
    }
	.hd_btn_sp .hdbtn_01 a:hover{
		color: #fff;
	}
	.hd_btn_sp .hdbtn_01 a .txt12{
        font-size: 3vw;
    }
}

@media screen and (max-width: 568px) {
	.hd_btn_sp .hdbtn_01 a,	.hd_btn_sp .hdbtn_02 a{
		padding: 8% 0;
	}
	.hd_btn_sp .hdbtn_01 a{
        font-size: 6vw;
    }
	.hd_btn_sp .hdbtn_01 a .txt12{
        font-size: 3.5vw;
		margin-right: 5px;
    }
	.hd_btn_sp .hdbtn_02 a .txt20{
        font-size: 3vw;
    }
}

/* ------------------------- sec01 ------------------------- */
#sec01{
	padding: 70px 0;
	display: block;
	margin:0 auto;
	text-align: center;
}

#sec01 h2{
	position: relative;
	font-size: 40px;
	text-align: center;
	display: inline-block;
	margin-bottom: 50px;
}

#sec01 h2 span{
	padding: 3px 80px;
	position: relative;
}
#sec01 h2 span:before{
	position: absolute;
	content: url(../img/h2_bgleft.svg);
	top: -25px;
	left: 0;
}

#sec01 h2 span:after{
	position: absolute;
	content: url(../img/h2_bgright.svg);
	bottom: -10px;
	right: 0;
}


.client_slide{
	width: 100%;
}
.client_slide img{
	max-width: 140px;
    max-height: 100px;
    margin: 0 10px;
}

.client-slick__item {
    margin-right: 5px;
    margin-left: 5px;
}

.sec01_box{
	margin: 50px auto;
	display: flex;
	align-items: center;
}

.sec01_box div{
	width: 32%;
	height: auto;
	display: flex;
    flex-direction: column;
    /* align-content: center; */
    align-items: center;
}

.sec01_box img{
	width: 636px;
	height: auto;
}

.sec01_box h3{
	color: #fff;
	background: #142C4D;
	display: inline-block;
	padding: 5px 30px;
	text-align: center;
	margin-bottom: 30px;
}

.sec01_box div:first-of-type p{
	background: url(../imgs/top/sec01_fuki-left.png) no-repeat;
	background-size: contain;
	line-height: 1.3em;
	font-weight: bold;
	color: #142C4D;
	text-align: left;
	width: 405px;
	height: 97px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
	padding-right: 5%;
	box-sizing: border-box;
}

.sec01_box div:first-of-type p:nth-of-type(2){
	margin-left: 40px;
}

.sec01_box div:last-of-type p{
	background: url(../imgs/top/sec01_fuki-right.png) no-repeat;
	background-size: contain;
	font-size: 22px;
	line-height: 1.3em;
	font-weight: bold;
	color: #142C4D;
	text-align: left;
	width: 405px;
	height: 97px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
	padding-left: 5%;
	box-sizing: border-box;
}

.sec01_box div:last-of-type p:nth-of-type(2){
	margin-left: 40px;
}

@media screen and (max-width:1200px) {
	.sec01_box h3 {
		font-size: 2vw;
	}

	.sec01_box div:first-of-type p {
		font-size: 1.7vw;
		width: 100%;
		height: auto;
		margin-bottom: 8%;
		padding: 4% 10% 4% 0%;
	}
	.sec01_box div:last-of-type p {
		font-size: 1.7vw;
		width: 100%;
		height: auto;
		margin-bottom: 8%;
		padding: 4% 12%;
	}
}

@media screen and (max-width:767px) {
	#sec01 {padding: 10% 0;}
	#sec01 h2 {line-height: 1.6em;}
	.sec01_box {
		flex-direction: column;
		margin: 10% auto;
	}

	.sec01_box div {
		width: 100%;
		height: auto;
	}

	.sec01_box h3{
		font-size: 5vw;
	}

	.sec01_box img{
		width: 60%;
		margin-bottom: 10%;
	}
	.sec01_box div:first-of-type,
	.sec01_box div:last-of-type{
		width: 100%;
		height: auto;
		margin: 0 auto;
	}
	.sec01_box div:first-of-type p {
		background: url(../imgs/top/sec01_fuki-top.png) no-repeat;
		background-size: contain;
		font-size: 4.5vw;
		width: 80%;
		display: flex;
		height: auto;
		margin: 0 auto 3%;
		padding-right: initial;
		padding-bottom: 11%;
		padding-top: 4%;
		align-items: center;
	}
	.sec01_box div:first-of-type p:nth-of-type(2) {
		margin-left: 15%;
	}

	.sec01_box div:last-of-type p {
		background: url(../imgs/top/sec01_fuki-bottom.png) no-repeat;
		background-size: contain;
		font-size: 4.5vw;
		width: 80%;
		display: flex;
		height: auto;
		margin: 0 auto 3%;
		padding-left: initial;
		padding-top: 8%;
		padding-bottom: 4%;
		align-items: center;
	}

	.sec01_box div:last-of-type p:nth-of-type(2) {
		margin-right: 15%;
	}

}


/* ------------------------- sec02 ------------------------- */
#sec02{
	padding: 100px 0;
	display: block;
	margin:0 auto;
	background: #474747 url(../img/sec02_bgimg.png) no-repeat center;
	background-size: cover;
}

#sec02 h2{
	position: relative;
	font-size: 40px;
	text-align: center;
	display: block;
	margin: 0 auto 50px;
}

#sec02 h2 span{
	padding: 3px 80px;
	position: relative;
}
#sec02 h2 span:before{
	position: absolute;
	content: url(../img/h2_bgleft.svg);
	top: -25px;
	left: 0;
}

#sec02 h2 span:after{
	position: absolute;
	content: url(../img/h2_bgright.svg);
	bottom: -10px;
	right: 0;
}

.sec02_meritbox{
	display: flex;
	justify-content: space-evenly;
	gap: 30px;
}

.sec02_meritbox div{
	background: #fff url(../img/sec02_merit_bg.svg) no-repeat left 0 top 0;
	padding: 0 2% 2%;
	overflow: visible;
	width: calc(32.7% - 15px);
	position: relative;
	margin-top: 80px;
}

.sec02_meritbox div > div{
	background:none;
	padding: 0;
	width: 100%;
}

.sec02_meritbox div > div > img{
	display: block;
	margin: -36% auto 30px;
    width: 80%;
    height: auto;
}

#sec02 .sec02_meritbox div h3{
	width: initial;
	background: none;
	border: none;
	text-align: center;
	display: flex;
	margin-bottom: 20px;
	justify-content: space-between;
	gap: 15px;
	padding: 0;
	align-items: flex-start;
	border-bottom: 1px solid #707070;
    padding-bottom: 20px;
}
#sec02 .sec02_meritbox div h3 p:first-of-type{
	text-align: center;
	margin: 0;
	line-height: 1.8em;
}
#sec02 .sec02_meritbox div h3 span{
	display: block;
}
#sec02 .sec02_meritbox div h3 p:last-of-type{
	line-height: 1.4em;
}

#sec02 .sec02_meritbox div p{
	text-align: left;
}

#sec02 .sec02_meritbox .sec02_meritbox_in img{
	display: block;
	width: 60%;
	height: auto;
	margin: -65px auto 30px;
}


#sec02 .sec02_meritbtm h3{
	text-align: center;
	background-color: #fff;
	background-image: url(../img/h2_bgleft.svg), url(../img/h2_bgright.svg);
	background-position: left 0 top 0, right 0 bottom 0;
	background-repeat: no-repeat, no-repeat;
	display: block;
	max-width: 90%;
	width: 570px;
	padding: 1% 80px;
	margin: 0 auto -2%;
	box-sizing: border-box;
	position: relative;
	z-index: 3;
}

ul.sec02_check{
	color: #fff;
	position: relative;
	z-index: 0;
	padding: 50px 4% 30px;
	display: flex;
	border-top: 1px solid #CDCDCD;
	border-bottom: 1px solid #CDCDCD;
	gap: 10px 40px;
	flex-wrap: wrap;
}

ul.sec02_check li{
	width: calc( 50% - 20px );
	margin: 5px auto;
	padding-left: 20px;
	background: url(../img/sec02_check.svg) no-repeat left 0 top 10px;
}

@media screen and (max-width:896px) {
	#sec02{
		padding: 60px 0;
		background: #474747 url(../img/sec02_bgimg_sp.png) no-repeat center;
		background-size: cover;
	}

	#sec02 h2 span {
		padding: 3px 80px;
		position: relative;
		width: 100%;
		display: block;
	}

	.sec02_meritbox{
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 30px;
	}
	
	.sec02_meritbox div{
		background: #fff url(../img/sec02_merit_bg.svg) no-repeat left 0 top 0;
		padding: 0 2% 2%;
		overflow: visible;
		width: 100%;
		position: relative;
		margin-top: 80px;
	}
	#sec02 .sec02_meritbox div h3{
        display: flex;
        margin-bottom: 20px;
        justify-content: center;
        align-items: center;
	}

	#sec02 .sec02_meritbox div h3 p.txt20{
		font-size: 20px;
	}
	
	#sec02 .sec02_meritbtm h3 {
		text-align: center;
		height: 100%;
		display: block;
		max-width: 90%;
		width: 90%;
		padding: 10px 15px;
		margin: 0 auto -5%;
		box-sizing: border-box;
		position: relative;
		z-index: 3;
	}

	#sec02 .sec02_meritbtm h3 span{position: relative;}

	ul.sec02_check{
		border:1px solid #CDCDCD;
		flex-direction: column;
		padding-top: 10%;
	}

	ul.sec02_check li {
		width: 100%;
		margin: 5px auto;
	}

}
@media screen and (max-width:767px) {
	#sec02 h2{
		font-size: 5vw;
	}

	#sec02 h3 {
		font-size: 5vw;
		width: 100%;
		padding: 1% 2%;
		margin-bottom: 8%;
	}
	.sec02_meritbox {
		display: flex;
		justify-content: space-evenly;
		flex-wrap: wrap;
	}
	.sec02_meritbox div {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-content: center;
		align-items: center;
		margin-bottom: 5%;
		padding: 4%;
	}

	#sec02 .sec02_meritbox div h3 {
		padding-left: 0;
		margin-bottom: 3%;
	}

	.sec02_meritbox div > div {
		background: none;
		padding: 0;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		margin-bottom: 0;
	}

	.sec02_meritbox div > div > img {
		display: block;
		margin: 5% auto;
		width: 72%;
		height: auto;
	}
}



/* ------------------------- sec03 ------------------------- */
#sec03{
	padding: 100px 0;
	display: block;
	margin:0 auto;
	background: #fff url(../img/sec03_secbg.jpg) no-repeat center;
	background-size: cover;
}

#sec03 h2{
	position: relative;
	font-size: 40px;
	text-align: center;
	display: block;
	margin: 0 auto 50px;
	width: 580px;
}

#sec03 h2 span{
	padding: 3px 80px;
	position: relative;
	width: 100%;
}
#sec03 h2 span:before{
	position: absolute;
	content: url(../img/h2_bgleft.svg);
	top: -25px;
	left: 0;
}

#sec03 h2 span:after{
	position: absolute;
	content: url(../img/h2_bgright.svg);
	bottom: -10px;
	right: 0;
}

#sec03 .sec03_case_wrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

#sec03 .sec03_case_wrap .sec03_case_box{
	width: calc(32.7% - 15px);
	background-color: #fff;
	filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
	box-sizing: border-box;
	padding: 1%;
	font-size: 18px;
}

#sec03 .sec03_case_wrap .sec03_case_box h3{
	display: flex;
	width: 100%;
	line-height: 1.2em;
	padding: 2%;
	box-sizing: border-box;
	height: 73px;
	justify-content: center;
	align-items: center;
	background: #000 url(../img/sec03_rech3_bg.svg) no-repeat left 0 top 0;
}

#sec03 .sec03_case_wrap .sec03_case_box h4{
	margin: 20px 10px 10px;
}
#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_top{
	padding: 0 10px 15px;
	border-bottom: 1px dashed #BCBCBC;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_top dl{
	display: flex;
	gap: 10px;
	justify-content: flex-start;
	align-items: flex-start;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_top dl dt{
	width: 80px;
	text-align:justify;
	text-align-last:justify;
	padding-left: 18px;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_top dl:first-of-type dt{
	background: url(../img/sec03_icon_map.svg) no-repeat left 0 top 50%;
}
#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_top dl:last-of-type dt{
	background: url(../img/sec03_icon_coin.svg) no-repeat left 0 top 50%;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom1,
#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom2{
	padding: 15px 10px 0;
}

.sec03_case_box hr{
	border-bottom: 1px dashed #BCBCBC;
	border-right: none;
	border-left: none;
	border-top: none;
	margin: 0;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom1 dl{
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom1{
	padding-bottom: 10px;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom1 dl dt,
#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom2 dl dt{
	padding-left: 18px;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom1 dl dd,
#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom2 dl dd{
	line-height: 1.6em;
}

#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom1 dl dt{
	background: url(../img/sec03_icon_bag.svg) no-repeat left 0 top 50%;
}
#sec03 .sec03_case_wrap .sec03_case_box .sec03_case_bottom2 dl dt{
	background: url(../img/sec03_icon_check.svg) no-repeat left 0 top 50%;
}



@media screen and (max-width:896px) {
	#sec03{
		padding: 60px 0;
		background: #fff url(../img/sec03_secbg.jpg) no-repeat left top;
		background-size: cover;
	}
	#sec03 h2 {
		padding: 0;
		width: 100%;
		display: block;
	}
	#sec03 h2 span{
		width: 100%;
		display: block;
	}

	#sec03 .sec03_case_wrap{
		width: 100%;
		display: flex;
		flex-direction: column;
	}

	#sec03 .sec03_case_wrap .sec03_case_box{
		width: 100%;
		padding: 2%;
		font-size: 18px;
	}
	#sec03 .sec03_case_wrap .sec03_case_box h3{height: auto;}
}

/* ------------------------- cvarea ------------------------- */
#sec_cta01,
#sec_cta02{
	padding: 100px 0;
	display: block;
	margin:0 auto;
	text-align: center;
	background: url(../img/cta_bg.jpg) no-repeat center;
	background-size: cover;
}

#sec_cta01 h2,
#sec_cta02 h2{
    padding: 0 3%;
    box-sizing: border-box;
	text-align: center;
	line-height: 1.3em;
	margin-bottom: 3%;
}


.cvarea_btn{
	width: 100%;
	display: flex;
	justify-content: space-around;
}

.cvarea_btn a{
	display: block;
	border-radius: 60px;
	text-align: center;
	margin: 0 auto;
	filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
	transition: .3s;
}

.cvarea_btn a:hover{
	background: #EE0000;
}

.cvarea_btn a span{
	display: flex;
	padding: 20px 50px;
	width: 100%;
	height: auto;
	justify-content: center;
	align-items: center;
}

.cvarea_btn a span i{
	font-size: 18px;
	margin-right: 10px;
	margin-top: 5px;
}
@media screen and (max-width:896px) {
	#sec_cta01,
	#sec_cta02{
		padding: 60px 0;
		display: block;
		margin:0 auto;
		text-align: center;
		background: url(../img/cta_bg_sp.jpg) no-repeat center;
		background-size: cover;
	}
	.cvarea_btn a{width: 100%; font-size: 5vw;}
	.cvarea_btn a span{padding:20px 10px;}
}


/* ------------------------- sec04 ------------------------- */
#sec04{
	padding: 100px 0;
	display: block;
	margin:0 auto;
	background: #fff url(../img/sec04_bg.png) no-repeat center;
	background-size: cover;
}

#sec04 h2{
	position: relative;
	font-size: 40px;
	text-align: center;
	display: block;
	margin: 0 auto 50px;
}

#sec04 h2 span{
	padding: 3px 80px;
	position: relative;
	width: 100%;
}
#sec04 h2 span:before{
	position: absolute;
	content: url(../img/h2_bgleft.svg);
	top: -25px;
	left: 0;
}

#sec04 h2 span:after{
	position: absolute;
	content: url(../img/h2_bgright.svg);
	bottom: -10px;
	right: 0;
}

.sec04_agentbox{
	background: #fff url(../img/sec02_merit_bg.svg) no-repeat left 0 top 0;
	padding: 2% 0;
	overflow: visible;
	position: relative;
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin: 0 auto 30px;
}
.sec04_agentbox div:first-of-type{
	width: 25%;
}
.sec04_agentbox div:last-of-type{
	flex: 1;
	padding: 2% 2% 2% 0;
}
.sec04_agentbox div:first-of-type img{
	width: 100%;
	height: auto;
	position: relative;
	margin: 0 -20px 0 -20px;
}

.sec04_agentbox div:last-of-type h3{
	display: block;
	border-bottom: 1px solid #707070;
	padding-bottom: 10px; 
}

.sec04_agentbox div:last-of-type h4{
	margin: 2% 0;
	display: flex;
	align-items: center;
}

.sec04_agentbox div:last-of-type h4 i{
	color: #F29500;
	font-size: 15px;
	margin-right: 10px;
}

@media screen and (max-width:896px) {
	#sec04{
		padding: 60px 0;
	}
	#sec04 h2{
		position: relative;
		font-size: 40px;
		text-align: center;
		display: block;
		margin: 0 auto 50px;
	}
	
	#sec04 h2 span{
		padding: 3px 40px;
		position: relative;
		display: block;
		width: 100%;
	}
	#sec04 h2 span:before{
		position: absolute;
		content: url(../img/h2_bgleft.svg);
		top: -10px;
		left: 0;
	}
	
	#sec04 h2 span:after{
		position: absolute;
		content: url(../img/h2_bgright.svg);
		bottom: -10px;
		right: 0;
	}

	.sec04_agentbox{
		padding: 4%;
		flex-direction: column;
		justify-content: flex-start;
	}

	.sec04_agentbox div:first-of-type{
		width: 100%;
		box-sizing: border-box;
		padding: 5%;
	}

	.sec04_agentbox div:first-of-type img{
		width: 80%;
		max-width: 100%;
		display: block;
		margin: 0 auto;
	}
	.sec04_agentbox div:last-of-type{
		padding: 2%;
	}
}


/* ------------------------- sec05 ------------------------- */
#sec05{
	padding: 100px 0;
	display: block;
	margin:0 auto;
	background: #fff url(../img/sec05_bg.jpg) no-repeat center;
	background-size: cover;
}

#sec05 h2{
	position: relative;
	font-size: 40px;
	text-align: center;
	display: block;
	margin: 0 auto 50px;
}

#sec05 h2 span{
	padding: 3px 80px;
	position: relative;
	width: 100%;
}
#sec05 h2 span:before{
	position: absolute;
	content: url(../img/h2_bgleft.svg);
	top: -25px;
	left: 0;
}

#sec05 h2 span:after{
	position: absolute;
	content: url(../img/h2_bgright.svg);
	bottom: -10px;
	right: 0;
}


@media screen and (max-width: 896px) {
	#sec05{
		padding: 60px 0;
		background: #fff url(../img/sec05_bg.jpg) no-repeat left center;
	}
	#sec05 h2{
		position: relative;
		font-size: 40px;
		text-align: center;
		display: block;
		margin: 0 auto 50px;
	}
	
	#sec05 h2 span{
		padding: 3px 40px;
        width: 100%;
        display: block;
	}
	#sec05 h2 span:before{
		position: absolute;
		content: url(../img/h2_bgleft.svg);
		top: -25px;
		left: 0;
	}
	
	#sec05 h2 span:after{
		position: absolute;
		content: url(../img/h2_bgright.svg);
		bottom: -10px;
		right: 0;
	}
}

/*----- QA -----*/
.qa-list dl {
    position: relative;
    margin: 0 auto 30px;
    padding: 28px 30px;
	background: #fff;
	box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.16);
}

.qa-list dl dt {
    position: relative;
    margin: 0;
    padding: 0 0 0 55px;
}
.qa-list dl dt::before {
    line-height: 1;
    position: absolute;
    top: 3px;
    left: 0;
    display: block;
    content: '　';
	background: url(../img/sec05_faq_q.png) no-repeat left center;
	background-size: 35px 35px;
	width: 35px;
	height: 35px;
}
.qa-list dl dd::before {
    line-height: 1;
    position: absolute;
    top: 3px;
    left: 2px;
    display: block;
    content: '　';
	background: url(../img/sec05_faq_a.png) no-repeat left center;
	background-size: 35px 35px;
	width: 35px;
	height: 35px;
	margin-top: 20px;
}
.qa-list dl dd {
    position: relative;
    height: auto;
    margin: 20px 0 0;
    padding: 20px 0 0 55px;
	line-height: 1.4em;
	border-top: 1px dashed #C7C7C7;
}
.qa-list dl dd p {
    margin: 30px 0 0;
}
.qa-list dl dd p:first-child{
    margin-top: 0;
}

@media screen and (max-width: 896px) {
	.qa-list dl {
		position: relative;
		padding: 15px 20px;
	}
	.qa-list dl::before {
		top: 20px;
		right: 20px;
		width: 7px;
		height: 7px;
	}

	.qa-list dl dt::before,
	.qa-list dl dd::before {
		background-size: 30px 30px;
		width: 30px;
		height: 30px;
	}

	.qa-list dl dt{
		margin-top: 5px;
	}

	.qa-list dl dt.txt20{
		font-size: 18px;
	}

	.qa-list dl dt, .qa-list dl dd {
		padding: 0 0 0 50px;
	}
	.qa-list dl dd{
	margin: 15px 0 0;
	}
	.qa-list dl dd p {
		margin: 30px 0 0;
		padding-top: 15px;
	}
	.qa-list dl dd p:first-child{
		margin-top: 0;
	}
}


/* ------------------------- sec06 ------------------------- */
#sec06{
	padding: 100px 0;
	display: block;
	margin:0 auto;
	background: #474747 url(../img/sec06_bg.png) no-repeat center;
	background-size: cover;
}

#sec06 h2{
	position: relative;
	font-size: 40px;
	text-align: center;
	display: block;
	margin: 0 auto 50px;
}

#sec06 h2 span{
	padding: 3px 80px;
	position: relative;
}
#sec06 h2 span:before{
	position: absolute;
	content: url(../img/h2_bgleft.svg);
	top: -25px;
	left: 0;
}

#sec06 h2 span:after{
	position: absolute;
	content: url(../img/h2_bgright.svg);
	bottom: -10px;
	right: 0;
}

.sec06_flow{
	display: flex;
	gap: 18px;
	justify-content: space-between;
	align-items: stretch;

}

.sec06_flow_in{
	background: #fff;
	padding: 1% 1% 2%;
	text-align: center;
	box-sizing: border-box;
	width: 15%;
}

.sec06_flow_in img{
	width: 45%;
	height: auto;
	margin: 4% auto 2%
}

.sec06_flow_in h3{
	min-height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 896px) {
	#sec06{
		padding: 60px 0;
		background: #474747 url(../img/sec06_bg_sp.png) no-repeat center;
		background-size: cover;
	}
	#sec06 h2{
		width: 100%;
	}
	
	#sec06 h2 span{
		padding: 3px 40px;
        width: 100%;
        display: block;
	}

	.sec06_flow{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 40px 18px;
	}
	
	.sec06_flow_in{
		background: #fff;
		padding: 2% 1%;
		width: 29%;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
	}
	.sec06_flow_in img{
		width: 50%;
		height: auto;
		margin: 2% auto;
	}
	
	.sec06_flow_in h3{
		min-height: 60px;
		display: flex;
		justify-content: center;
	}
}

@media screen and (max-width: 568px) {
	.sec06_flow_in h3{
		font-size: 3vw;
	}
}


/* ------------------------- footer ------------------------- */
#footer{
	padding: 1% 0 0;
	background: #000;
	color: #fff;
	text-align: center;
	position: relative;
}

#footer .pvp img{
	width: 60px;
	height: auto;
	position: absolute;
	right: 10px;
	top: 10px;
}
.footer_link {
	margin: 30px auto;
	display: flex;
	justify-content: center;
}
.footer_link a{
	color: #fff;
	margin: 0 15px;
	line-height: 1.1em;
	text-decoration: underline;
	font-size: 18px;
}
.footer_link a:hover{
	text-decoration: none;
}

#copyright{
	padding: 2%;
}

@media screen and (max-width: 896px) {
	#footer{
		padding: 1% 0 100px;
	}
	#footer .pvp img{
		width: 60px;
		height: auto;
		position: relative;
		display: block;
		margin: 10px auto;
		right: initial;
		top: initial;
	}

}

@media screen and (max-width: 568px) {
	#footer .ft_lpbana{bottom: 0; left: 0; right: 0;}
	#footer .ft_lpbana img{width: 100%; max-width: 80%; display: block; margin: 0 auto; filter: none;}
}


/*--------------------------------------------

FVまわり

--------------------------------------------*/

.loading {
	width: 100vw;
	height: 100vh;
	background: rgba(255,255,255,1.0);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20000;
	display: flex;
	justify-content: center;
	align-items: center;
}

.loading img {
	width: 200px;
	max-width: 30%;
	height: auto;
}

.fv_box_text{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	width: 100%;
}

.fv_box_text h2.fvtext_h2{
	position: relative;
	text-align: right;
	overflow: visible;
	z-index: 0;
}

.fv_box_text h2.fvtext_h2:before{
	position: absolute;
    z-index: 1;
    background: url(../img/fv_catch_eng.svg);
    content: '　';
    top: 34%;
    left: 17%;
    width: 57%;
    height: 35%;
    background-size: cover;
}

.fv_box_text h2.fvtext_h2:after{
    position: absolute;
    z-index: 1;
    background: url(../img/fv_catch_p.svg);
    content: '　';
    bottom: -5%;
    right: -10%;
    width: 8%;
    height: 63%;
    background-size: cover;
}


.fv_box_text h2.fvtext_h2 p:first-of-type{
	letter-spacing: 0.05em;
}

.fv_box_text h2.fvtext_h2 p:last-of-type{
	letter-spacing: 0.15em;
}

.fv_box_text h2.fvtext_h2 p span.h2bg{
	background-color: #FFF8D6;
    padding: 10px 20px 20px;
    line-height: 0.8em;
    height: 80px;
    display: inline-block;
}

.fv_box_text h2.fvtext_h2 p span.h2bg2{
	background-color: #FFF8D6;
    padding: 20px 40px 30px;
    line-height: 0.8em;
    font-size: 88px;
    display: inline-block;
	margin-top: 20px;
}

@media screen and (max-width: 1201px) {
	.fv_box_text{
		align-items: center;
	}
}

@media screen and (max-width: 585px) {
	.fv_box_text h2.fvtext_h2{text-align: center;}
	.fv_box_text h2.fvtext_h2 p span.h2bg{
		height: auto;
	    padding: 5px 10px 10px;
	}
	.fv_box_text h2.fvtext_h2:before {
		top: 37%;
        left: 3%;
        width: 90%;
	}

	.fv_box_text h2.fvtext_h2:after {
		bottom: -4%;
		right: 2%;
		width: 8%;
		height: 50%;
	}

	.fv_box_text h2.fvtext_h2 p span.h2bg .txt50{
		font-size: 6vw;
	}
	.fv_box_text h2.fvtext_h2 p span.h2bg .txt24{
		font-size: 4vw;
	}
	
	.fv_box_text h2.fvtext_h2 p span.h2bg2{
		background-color: #FFF8D6;
		padding: 20px 20px 30px;
		line-height: 0.8em;
		font-size: 12vw;
		display: inline-block;
		margin-top: 20px;
	}
}

/* ハンバーガーボタンのデザイン */
.drawer__button {display: none;}
.drawer__nav{display: none;}
@media screen and (max-width: 896px){
	.drawer__button {
		display: inline;
        position: fixed;
        width: 60px;
        height: 60px;
		background-color: transparent;
		border: none;
		cursor: pointer;
		z-index: 999; /* メニューを開いている時もクリックできるよう設定 */
		top: 0;
		right: 0;
		background: #000;
	}
	/* ハンバーガーボタン内の線 */
	.drawer__button > span {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		width: 2rem;
		height: 2px;
		background-color: #fff;
		transform: translateX(-50%);
	}
	.drawer__button > span:first-child {
		transform: translate(-50%, calc(-50% - 0.5rem));
		transition: transform 0.3s ease;
	}
	.drawer__button > span:nth-child(2) {
		transform: translate(-50%, -50%);
		transition: opacity 0.3s ease;
	}
	.drawer__button > span:last-child {
		transform: translate(-50%, calc(-50% + 0.5rem));
		transition: transform 0.3s ease;
	}
	/* 展開時のデザイン */
	.drawer__button.active > span:first-child {
		transform: translate(-50%, -50%) rotate(-45deg);
	}
	.drawer__button.active > span:nth-child(2) {
		opacity: 0;
	}
	.drawer__button.active > span:last-child {
		transform: translate(-50%, -50%) rotate(45deg);
	}
	/* メニューのデザイン */
	.drawer__nav {
		display: block;
		position: fixed; /* 追従ヘッダーなどでも表示できるよう設定しておく */
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.5);
		transition: opacity 0.3s ease;
		opacity: 0;
		visibility: hidden;
	}
	.drawer__nav.active {
		opacity: 1;
		visibility: visible;
	}
	.drawer__nav__inner {
		position: relative;
		width: 100%;
		height: 100%;
		background-color: #707070;
		padding: 4rem 1.5rem 1rem;
		margin: 0 0 0 auto;
		overflow: scroll;
		transform: translateX(100%);
		transition: transform 0.3s ease;
	}
	.drawer__nav.active .drawer__nav__inner {
		transform: translateX(0);
	}
	.drawer__nav__menu {
		list-style: none;
		padding-left: 0;
	}
	.drawer__nav__link {
		display: block;
		color: #fff;
		text-decoration: none;
		padding: 1rem 1rem;
		border-bottom: solid 1px rgb(255, 255, 255);
		font-size: 1.2rem;
	}

	.sp_btn a{
		border-radius: 50px!important;
		width: 80%!important;
		margin: 3% auto 0!important;
	}
	
	/* ハンバーガーメニュー展開時、背景を固定 */
	body.active {
		height: 100%;
		overflow: hidden;
	}
}