@charset "utf-8";

/* =======================================

	Header CSS

========================================== */
header{
	position: relative;
}
header .top{
	flex-direction: column;
	align-items: center;
	padding: 10px 5px 5px 5px;
}
header .top .area_logo {
	margin-top: 0;
}
header .top .logo .area_logo a{
	width: 191px;
	margin: 0 auto;
}
header .top .logo .register{
	margin: 5px 0 0;
	font-size: 8px;
	line-height: 1.2;
	text-align: center;
}
header .top .area_link{
	margin-top: 10px;
	width: 363px;
	max-width: 100%;
}
header .top .area_link .about_license{
	padding-left: 25px;
}
header .top .area_link .about_license::before{
	width: 25px;
}
header .top .area_link .about_license::after{
	width: 15px;
	height: 15px;
	left: 5px;
}
header .top .area_link .sub_links a{
	font-size: 12px;
}
header .top .area_link .sub_links a.member{
	margin-left: 3.5px;
}
header .top .area_link .sub_links a::before{
	width: 12px;
	height: 12px;
	margin-right: 4px;
}
@media(max-width:350px){
	header .top .area_link .about_license{
		font-size: 14px;
	}
}


header .catch {
	width: 96%;
	height: 52px;
	padding: 5px 2% 0;
	line-height: 1.5em;
	font-size: 16px;
}

/* =======================================

	Globalnavi CSS

========================================== */
#gnav {
	display: none;
	width: 100%;
	height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
	overflow-x: hidden;
	overflow-y: scroll;
}

#gnav>ul {
	background: none;
	width: 100%;
	display: block;
}

#gnav>ul>li {
	background: none;
	display: block;
	width: 100%;
	height: auto;
}

#gnav>ul>li a {
	display: block;
	width: 100%;
	line-height: 42px;
	margin: 0;
	padding: 0;
	font-size: 16px;
	text-align: left;
	padding: 0 17px;
	height: auto;
}

#gnav>ul>li.sub>a {
/*	pointer-events: none;*/
}

#gnav>ul>li ul {
	display: block;
	position: relative;
	left: 0;
	max-width: none;
	width: 100%;
	padding-left: 17px;
	box-sizing: border-box;
}
#gnav>ul>li ul li{
	position: relative;
}
#gnav>ul>li ul li a {
	padding: 0 17px;
	text-indent: 0;
	font-size: 16px;
	font-weight: 500;
}

#gnav>ul>li ul li a:before {
	content: "";
	width: 9px;
	height: 14px;
	background: url('../img/common/gnav_arrow_sp.svg') no-repeat center center;
	-webkit-background-size: contain;
	background-size: contain;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto 0;
}

#navopen {
	display: block;
  position: absolute;
  background: #fff;
  width: 56px;
  height: 56px;
  top: 10px;
  left: 8px;
  border: 1px solid #000;
	padding-top: 9px;
	box-sizing: border-box;
	cursor: pointer;
}

#navopen .navicon {
	display: block;
	width: 36px;
	height: 26px;
	margin: 0 auto 5px;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	position: relative;
}
#navopen .navicon::before{
	content: "";
	height: 2px;
	width: 100%;
	position: absolute;
	top: calc(50% - 1px);
	left: 0;
	background-color: #000;
}
#navopen p{
	text-align: center;
	font-size: 8px;
	white-space: nowrap;
}

#gnav .gnav_header{
	position: relative;
	border-bottom: 1px solid #fff;
	padding: 8px 0;
}
#gnav .gnav_header #navclose{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 8px;
	margin: auto 0;
	padding-top: 4px;
	width: 56px;
  height: 56px;
	border: 1px solid #fff;
	box-sizing: border-box;
  cursor: pointer;
}
#gnav .gnav_header #navclose .navicon{
	height: 36px;
	position: relative;
}
#gnav .gnav_header #navclose .navicon::before,
#gnav .gnav_header #navclose .navicon::after{
	content: "";
	width: 36px;
	height: 2px;
	background-color: #fff;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#gnav .gnav_header #navclose .navicon::before{
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#gnav .gnav_header #navclose .navicon::after{
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
#gnav .gnav_header #navclose p {
  text-align: center;
  font-size: 8px;
  white-space: nowrap;
	color: #fff;
}
#gnav .gnav_header a.logo{
	display: block;
	width: 191px;
	margin: 0 auto;
}

.button02 {
	width: 100%;
}

#home #mv .important_notices{
	order: 1;
}
#home #mv .top_slider{
	order: 2;
}
#home #mv .important_notices dl{
	flex-direction: column;
}
#home #mv .important_notices dl dd,
#home #mv .important_notices dl dt{
	width: 100%;
	box-sizing: border-box;
	text-align: center;
}
#home #mv .important_notices dl dt{
	padding: 15px 10px;
}
#home #mv .important_notices dl dd{
	padding: 40px 10px;
}
#home #mv .important_notices dl dd a{
	justify-content: center;
}
@media(max-width:400px){
	#home #mv .important_notices dl dd a{
		flex-direction: column;
		align-items: center;
	}
	#home #mv .important_notices dl dd{
		padding: 15px 10px 25px;
	}
	#home #mv .important_notices dl dd .date{
		margin-right: 0;
		margin-bottom: 20px;
	}
}


/* =======================================

	Footer CSS

========================================== */
/* pagetop */
#pagetop {
	position: relative;
	max-width: 1000px;
	width: 100%;
	margin: 0 auto 0;
}

#pagetop p {
	position: fixed;
	right: 5%;
	bottom: 6%;
	margin: 0;
	padding: 0;
}

footer .inner {
	padding: 8% 0 6%;
}

footer .inner .area_link a {
	margin: 0 5% 3%;
}

footer .inner .area_logo {
	margin: 5% 0 0 0;
}

footer .copy {
	padding: 1% 0;
	line-height: 1.5em;
}




/* contents
========================================== */
h1 {
	margin-top: 10%;
}

h1 span {
	display: block;
	margin-left: 0;
	line-height: 2em;
}

h2 {
	width: 97%;
	padding-left: 3%;
}

h2 span {
	display: block;
	padding: 0 0 10px;
}

h4 {
	width: 97%;
	padding-left: 3%;
}

/* area (map caption) */
#area .inner .area_map img {
	max-width: 336px;
	width: 100%;
	margin: 0;
}

#area .inner .area_link {
	position: relative;
	width: 96%;
	margin: 0;
	padding: 5% 2%;
}

#area .inner .area_link .box {
	margin: 0;
}

#area .inner .area_link .box ul {
	padding: 0 0 0 0;
	text-align: center;
}

#area .inner .area_link .box ul li {
	float: none;
	display: inline-block;
	width: auto;
	line-height: 2em;
	margin: 1% 3%;
}

#area .inner .area_link .box ul li span {
	background-size: 1em;
	line-height: 2em;
	padding-left: 1.5em;
}

#area .inner .area_caption {
	top: 2%;
	left: 2%;
}

#area .inner .area_caption ul li .title span {
	background-size: 1em;
	line-height: 2em;
	padding-left: 1.5em;
}






/* subpage
========================================== */
/* targetlink */
#targetlink {
	margin: 3% 0 0 0;
}

#targetlink ul li {
	width: 30%;
}

#targetlink ul li a {
	background-image: none;
	padding: 0 0;
}

/* flow */
#flow .area_step {
	padding: 2%;
}

#flow .area_step dt {
	float: none;
	border: none;
	width: 100%;
}

#flow .area_step dt p,
#flow .area_step dt .area_title {
	display: inline-block;
	margin: 2% 0;
}

#flow .area_step dd {
	float: none;
	margin: 0 0;
}

#flow .area_step dd p {
	display: block;
	height: auto;
}

#flow .area_step dd span {
	display: block;
	margin-top: 10px;
	text-align: center;
}

#flow .area_step dd span a {
	margin: 0 0;
	padding: 0 0 2%;
}

#flow .area_button {
	margin: 5% 0 0 0;
}

#flow .area_button a {
	margin: 0 0;
	padding: 0 0 2%;
}

#flow .arrow {
	margin: 2% auto;
}




/* home
========================================== */
#home .contents .top {
	padding: 10% 0 5% 0;
}

#home .contents .top .area_box li,
#home .contents .top .area_box li:first-child {
	width: 95.5%;
	margin: 0 2% 2%;
}

@media(max-width:620px){
#home .contents .top .area_box li,
#home .contents .top .area_box li:first-child {
	min-height: auto;
	padding: 0 0 5%;
}
}

#home .contents .cont {
	margin: 10% auto;
	padding: 0;
}

#home .contents .cont .area_list {
	margin: 2% 3% 16%;
}

#home .contents .cont .area_list li p .area_date {
	width: auto;
	padding-right: 5%;
}

#home .contents .bottom .inner .area_l {
	float: none;
	width: 100%;
}

#home .contents .bottom .inner .area_l .area_document {
	width: 100%;
}

#home .contents .bottom .inner .area_l .area_document ul {
	margin: 10% 3% 0;
}

#home .contents .bottom .inner .area_l .area_document ul li .area_icon img {
	display: block;
	margin: auto;
}

#home .contents .bottom .inner .area_l .area_document ul li .area_icon a {
	display: block;
	line-height: 1.6em;
	text-align: center;
}

#home .contents .bottom .inner .area_r {
	float: none;
	width: 100%;
	text-align: center;
}

#home .contents .bottom .inner .area_r .fb-page {
	padding: 0;
}
.link_banner_line.index_bottom > a {
    width: 40%;
}
.link_banner_line.index_bottom{
	justify-content:space-around;
}
.link_banner.index_bottom {
     width: 100%;
    margin-bottom: 16px;
}
.link_banner_area{
	width: 100%;
    float: left;
    margin: 20px 0 10px 0;
}

.link_banner_line{
	max-width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
}

.link_banner{
	float: left;
	width:30%;
    margin-right: 5%;
}

.link_banner_r{
	float: right;
	width:30%;
}

.lec_link{
	max-width: 450px;
	margin-left:auto;
	margin-right:auto;
	text-align: center;
	margin-bottom: 20px;
}

/* PRIVACY POLICY
========================================== */
#privacy .cont {
	margin: 10% auto 6%;
}

#privacy .cont dl {
	margin: 10% 5% 0;
}

#privacy .cont dl dt {
	margin: 10% 0 0 0;
}

#privacy .cont dl dd {
	margin: 0 0 0;
}



/* MAINTENANCE
========================================== */
#maintenance #targetlink ul li {
	padding: 0;
}

#maintenance #case .inner .area_case li {
	float: none;
	width: 100%;
	margin: 0 0 5% 0;
}

#maintenance #case .inner .area_case li br {
	display: none;
}




/* LICENCE
========================================== */
#licence #targetlink ul li {
	padding: 0;
	margin: 0 0 2%;
}

#licence .cont .inner {
	margin: 10% 2% 0;
}

#licence #overview .inner {
	margin: 10% 2% 0;
}

#licence #detail .area_detail {
	margin: 5% 0 0;
	padding: 5% 0 0;
}

#licence #detail .area_detail dl {
	padding: 0 2% 5%;
}

#licence #detail .area_detail dl dd {
	margin-left: 5%;
}

#licence #detail .area_detail .area_title {
	padding: 0 2% 2%;
	line-height: 1.5em;
}

#licence #detail .area_detail .area_title span {
	display: block;
}

#licence #detail .area_detail .area_lightbox {
	margin: 0 0 0;
}

#licence #detail .area_detail .area_lightbox a {
	margin: 0 0 8%;
}

#licence #schedule .area_img img {
	margin-bottom: 5%;
	margin-left: 0;
}

#licence #voice ul li {
	float: none;
	display: block;
	width: 93%;
	margin: 0 0 5% 0;
	padding: 3%;
}

#licence #voice ul li:nth-child(2n-1) {
	margin-right: 0;
}

#licence #voice ul li .modal {
	padding: 5% 2%;
	width: 95%;
}



/* ABOUT US
========================================== */
#about #targetlink ul li {
	padding: 0 0 2%;
}

#about #access .inner .area_box {
	float: none;
	width: 96%;
	height: auto;
	margin: 0 0 5%;
	padding: 0 2% 5%;
}

#about #greeting .inner .area_txt {
	display: block;
	width: 96%;
	padding: 0 2%;
}

#about #greeting .inner .area_img {
	display: block;
	width: 96%;
	padding: 0 2%;
	text-align: center;
}




/* FAQ
========================================== */
#faq .contents {
	margin: 0 0 10%;
}

#faq .cont .inner {
	margin: 10% 2% 0;
}

#faq .cont .inner dl dt {
	padding-right: 25px;
}

#faq .cont .inner dl dd {
	padding-left: 2.5em;
}





/* MEMBERSHIP
========================================== */
#membership #targetlink ul li {
	padding: 0;
}

#membership #merits .area_border img {
	position: relative;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin: 0 auto 5%;
	display: block;
}

#membership #merits .area_border p {
	width: 100%;
	margin: 5% 0 0 0;
}

#membership #merits .area_button {
	margin: 10px 0 10px 0;
    text-align: center;
}

#membership .area_membership .inner {
	margin: 10% 0 0 5%;
}

#membership .member_logo img{
	width:  50%;
}

/* TESTS
========================================== */
#tests .cont .inner {
	margin: 10% 3% 0;
}

#tests #schedule .inner {
	margin: 10% 3% 0;
}

/* area detail */
#tests #area_detail .inner {
	position: relative;
	margin: 5% 3% 0 ;
}

#tests #area_detail .inner .appearance {
	position: relative;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	text-align: center;
	margin: 0 0 3%;
}

#tests #area_detail .inner dl dd .area_box {
	display: block;
}

#tests #area_detail .inner dl dd .area_box:first-child {
	padding-right: 0;
}



/* HOLDERS
========================================== */
#holders .cont .inner {
	margin: 8% 2% 10%;
}




/* EVENTS
========================================== */
#events .cont .inner {
	margin: 8% 2% 10%;
}



/* CONTACT
========================================== */
#contact .cont .inner {
	width: 96%;
	padding: 0 2%;
}

#contact .cont .inner .area_switch {
	margin: 10% 0 0 0;
}

#contact .cont .inner .area_switch span {
	width: 30%;
}

#contact .cont .inner table td div.hf,
#contact .cont .inner table td div.dv {
	float: none;
	width: 100%;
}

#contact .cont .inner table td input[type="text"],
#contact .cont .inner table td textarea,
#contact .cont .inner table td .input_s,
#contact .cont .inner table td .input_m,
#contact .cont .inner table td .input_l,
#contact .cont .inner table td .input_ll {
	max-width: 90%;
}

#contact .cont .inner table td input[type="radio"] {
}

#contact .cont .inner table td label {
	float: none;
	display: block;
	width: 100%;
	margin: 0 0 3%;
}

#contact .cont .inner table td label.label_l .annotation {
	width: auto;
}

select{
	max-width: 90%;
}

span.wpcf7-list-item{
	width: 90%;
}

#contact .cont .inner table td div.fl span{
	display: inline-block;
}

/* ブラッシュアップテスト */

#licence  .recommend {
	margin: 15px 10px 0;
}

#licence  .recommend .area_box {
	display: flex;
	flex-wrap: wrap;
	max-width: 1000px;
	width: 100%;
	margin: 20px auto 0;
	text-align: center;
}

#licence  .recommend .area_box li {
	display: inline-block;
	border: 1px solid #c5c5c5;
	background-color: #fff;
	max-width: 100%;
	width: 100%;
	/*min-height: 525px;*/
	margin: 20px 0 0 0;
	vertical-align: top;
}

/*#licence  .recommend .area_box li:first-child {
	margin: 0;
}*/

#licence  .recommend .area_box .area_title {
	margin: 18px 0 0;
	font-size: 18px;
	font-weight: bold;
}

#licence  .recommend .area_box .area_sub_title {
	font-size: 14px;
	font-weight: bold;
	margin-top: 10px;
}
.ribbon2 {
    left: -20px;
}
/*#licence  .recommend .area_box .area_sub_title:after {
	content: '';
	display: block;
	background: #ee7507;
	width: 43px;
	height: 4px;
	margin: 16px auto 16px;
	text-align: center;
}*/

#licence  .recommend .area_box dl {
	margin: 15px 15px 15px 15px;
	text-align: left;
	line-height: 1.5em;
}

#licence  .recommend .area_box dl a {
	line-height: 1.8em;
}

#licence  .recommend .area_box dl dt {
}

#licence  .recommend .area_box dl dt a {
	font-size: 15px;
	font-weight: bold;
	color: #005bac;
}

#licence  .recommend .area_box dl dd {
	text-indent: 2em;
}

#licence  .recommend .area_box dl dd a {
	text-decoration: underline;
	font-size: 15px;
	font-weight: normal;
}

#licence #merits .area_box {
    margin: 26px 10px 0 10px;
    text-align: center;
}
#licence #merits .area_box .area_bg p {
    margin: 20px 20px;
}
#licence #merits .area_border .box img {
    float: none;
}
#licence #merits .area_border .box {
    text-align: center;
}
#licence #merits .area_border .box p {
    text-align: left;
    margin-top: 10px;
}
#licence #merits .area_border .area_title span.ribbon {
    display: block;
}
#licence #merits .area_border .area_title span.area_subtitle {
    display: block;
    padding: 10px 20px;
    line-height: 1.5em;
}
#licence div#update_flow table.update_img td {
    display: block;
    text-align: center;
    margin-bottom: 15px;
}
#licence div#update_flow table.update_img td li {
    text-align: left;
}

#update_flow .cont .inner table {
	margin-top:20px;
}

#update_flow .cont .inner table tr td .update_txt {
	text-align: left;
    vertical-align: middle;
}

/*ソリューションサービス*/
.solution{
	display: block;
}

.solution .button01{
	display: block;
    padding: 20px !important;
    font-size: 22px;
    margin: 20px auto 6px auto;
    width: 80%;
}


/*現場駆付けサービス PVランナー*/
.pv_runner .headline{
    display:  block;
}

.pv_runner .headline p{
    font-size: 1.8em;
    line-height: unset;
    color: #fff;
    background-color: #f11;
    text-align: center;
    width: 100%;
    padding: 5px;
}

.pv_runner .imageA{
    display: none;
}

.pv_runner .imageA_sp{
    display: block;
}

.pv_runner .imageB{
    display: none;
}

.pv_runner .imageB_sp{
    display: block;
}

.lp *, .lp *::after, lp *::before {
	box-sizing: border-box;
}

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

.lpKv .l-wrap {
	width: 96%;
	margin: auto;
	padding-top: 80px;
}

.lpKv {
	background: url('/wp-content/themes/jpma-child/common/img/lp/img_lp_kv01.jpg') center top no-repeat;
	background-size: cover;
	height: calc(680px - 190px);
	position: relative;
}

.lpKv__logo {
	position: absolute;
	top: 8px;
	left: 8px;
}

.lpKv__logo > img {
	width: 120px;
	height: auto;
}

.lpKv__license {
	position: absolute;
	bottom: 8px;
	right: 8px;
}

.lpKv__license > img {
	width: 108px;
	height: auto;
}

.lpKv__lede {
	font-size: 14px;
	line-height: 1.5;
	font-weight: 700;
	margin-bottom: 16px;
	text-align: center;
}

.lpKv__lede > span {
	color: #e14f5c;
	font-size: 24px;
}

.lpKv__title {
}

.lpKv__text {
	background-color: #f89900;
	color: #fff;
	font-weight: 700;
	font-size: 24px;
	display: inline-block;
	padding: 8px 16px;
	margin-bottom: 16px;
	box-shadow: 4px 4px 4px 0 rgba(0,0,0,0.6);
}

.lpKv__par {
	font-size: 14px;
	line-height: 1.75;
	font-weight: 700;
}

.lpKv__fukidashi {
	position: absolute;
	bottom: 80px;
	left: 0;
	right: 0;
	font-size: 18px;
	color: #0a5bab;
	border: 4px solid #0a5bab;
	border-radius: 8px;
	background-color: #fff;
	padding: 8px 16px;
	margin: auto;
	width: 80%;
	text-align: center;
}

.lpKv__fukidashi::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -22px;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #ffffff transparent transparent transparent;
}

.lpKv__fukidashi::before {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -30px;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #0a5bab transparent transparent transparent;
}

.lpTrouble {
	padding: 25px 0 80px;
}

.lpTrouble .l-wrap {
	width: 96%;
	margin: auto;
}

.lpTrouble__title {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	background-color: #fff;
	width: 80%;
	border: 4px solid #000;
	padding: 10px;
	text-align: center;
	margin: auto;
	position: relative;
	top: 50px;
	z-index: 1;
}

.lpTrouble__title > span {
	color: #e14f5c;
}

.lpTrouble__lists {
	position: relative;
	border: 4px solid #000;
	width: 100%;
	padding: 80px 16px 40px 24px;
	margin-bottom: 64px;
}

.lpTrouble__list {
	display: flex;
	align-items: flex-start;
	/*flex-direction: column;*/
	margin-bottom: 25px;
}

.lpTrouble__list:last-child {
	margin-bottom: 0;
}

.lpTrouble__pic {
	position: absolute;
	right: -15px;
	bottom: 0;
	z-index: 1;
}

.lpTrouble__pic > img {
	width: 160px;
	height: auto;
}

.lpTrouble__num {
	font-size: 16px;
	white-space: nowrap;
	position: relative;
	/*top: -10px;*/
	left: 0;
	right: 0;
	text-align: center;
	display: inline-block;
	align-items: center;
	justify-content: center;
	margin: auto;
	z-index: 2;
}

.lpTrouble__num ::before {
	content: '';
	position: absolute;
	left: -15px;
	bottom: -4px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 3px 0;
	border-color: #f89900 transparent transparent transparent;
	transform: rotate(-15deg);
}

.lpTrouble__num ::after {
	content: '';
	position: absolute;
	right: -15px;
	bottom: -4px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 3px 0;
	border-color: #f89900 transparent transparent transparent;
	transform: rotate(15deg);
}

.lpTrouble__num > span {
	color: #f89900;
	font-size: 24px;
}

.lpTrouble__text {
	font-size: 18px;
	line-height: 1.5;
	z-index: 1;
	padding-left: 28px;
	flex: auto;
}

.lpTrouble__license {
	text-align: center;
	font-size: 16px;
	line-height: 1.75;
	margin-bottom: 25px;
}

.lpTrouble__license > span {
	font-weight: 700;
	color: #0a5bab;
	font-size: 20px;
	text-decoration: underline;
}

.lpTrouble__par {
	font-size: 14px;
	text-align: center ;
	line-height: 1.75;
}

.lpNeed {
	background-color: #f3f5f7;
	padding: 60px 0;
}

.lpNeed__title {
	text-align: center;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	margin-bottom: 25px;
}

.lpNeed__title > span {
	font-size: 18px;
	color: #e14f5c;
}

.lpNeed__items {
	width: 96%;
	margin: auto;
	display: flex;
	flex-direction: column;
}

.lpNeed__pic {
	flex: 0 0 100%;
	margin-right: 0;
}

.lpNeed__caption p {
	font-size: 15px;
	line-height: 1.75;
	font-weight: 700;
	margin-bottom: 16px;
}

.lpNeed__lede {
	font-size: 18px;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 25px;
	position: relative;
}

.lpNeed__lede::before {
	position: absolute;
	left: 60px;
	top: 12px;
	display: block;
	content: "";
	width: 32px;
	height: 32px;
	border-left: 2px solid #000;
	border-bottom: 2px solid #000;
	transform: rotate(45deg);
}
.lpNeed__lede::after {
	position: absolute;
	right: 60px;
	top: 12px;
	display: block;
	content: "";
	width: 32px;
	height: 32px;
	border-right: 2px solid #000;
	border-top: 2px solid #000;
	transform: rotate(45deg);
}

.lpNeed__graph {
	margin-bottom: 25px;
	text-align: center;
}

.lpNeed__graph > img {
	width: 276px;
	height: auto;
}

.lpMerit {
	padding: 50px 0 25px;
}

.lpMerit__title {
	font-size: 18px;
	text-align: center;
	margin-bottom: 50px;
}

.lpMerit__title > span {
	color: #e14f5c;
}

.lpMerit__title > span > em {
	font-size: 32px;
	font-style: italic;
}

.lpMerit__items {
	width: 96%;
	margin: auto;
}

.lpMerit__item {
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	margin-bottom: 50px;
}

.lpMerit__pic {
	flex: 0 0 100%;
	margin-left: 0;
}

.lpMerit__lede {
	font-size: 18px;
	margin-bottom: 20px;
}

.lpMerit__text p {
	font-size: 14px;
	margin-bottom: 15px;
	line-height: 1.5;
}

.lpRecommend {
	background: none;
	padding: 50px 0;
}

.lpRecommend__title {
	font-size: 18px;
	text-align: center;
	position: relative;
	border: 4px solid #000;
	width: 96%;
	margin: 0 auto 50px;
	padding: 8px 16px;
}

.lpRecommend__title::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -22px;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #ffffff transparent transparent transparent;
}

.lpRecommend__title::before {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -30px;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #000 transparent transparent transparent;
}

.lpRecommend__items {
	width: 100%;
	margin: auto;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
}

.lpRecommend__item {
	position: relative;
	width: 80%;
	margin: 0 auto 50px;
	text-align: center;
}

.lpRecommend__item::before {
	content: '';
	position: absolute;
	left: -64px;
	top: -10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 260px 20px 0 20px;
	border-color: #0a5bab transparent transparent transparent;
	transform: rotate(-15deg);
}

.lpRecommend__item::after {
	content: '';
	position: absolute;
	right: -64px;
	top: -10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 260px 20px 0 20px;
	border-color: #0a5bab transparent transparent transparent;
	transform: rotate(15deg);
}

.lpRecommend__lede {
	display: inline-block;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 15px;
}

.lpRecommend__lede span {
	background: linear-gradient(transparent 60%, #0a5bab 60%);
}

.lpRecommend__text {
	font-size: 18px;
	margin-bottom: 15px;
}

.lpRecommend__par {
	font-size: 14px;
	line-height: 1.5;
}

.lpRecommend__item--yellow.lpRecommend__item::before,
.lpRecommend__item--yellow.lpRecommend__item::after {
	border-color: #f89900 transparent transparent transparent;

}

.lpRecommend__item--yellow .lpRecommend__lede span {
	background: linear-gradient(transparent 60%, #f89900 60%);
}

.lpRecommend__item--red.lpRecommend__item::before,
.lpRecommend__item--red.lpRecommend__item::after {
	border-color: #e14f5c transparent transparent transparent;

}

.lpRecommend__item--red .lpRecommend__lede span {
	background: linear-gradient(transparent 60%, #e14f5c 60%);
}

.lpVoice {
	background-color: #f3f5f7;
	padding: 50px 0;
	position: relative;
}

.lpVoice::after {
	content: '';
	top: 0;
	left: 0;
	position: absolute;
	border-style: solid;
	border-width: 0 50vw 20px 50vw;
	border-color: transparent #0a5bab transparent #0a5bab;
}

.lpVoice::before {
	content: '';
	bottom: 0;
	left: 0;
	position: absolute;
	border-style: solid;
	border-width: 20px 50vw 0 50vw;
	border-color: transparent #0a5bab transparent #0a5bab;
}

.lpVoice__title {
	font-size: 20px;
	font-weight: 700;
	text-align: center;
	color: #0a5bab;
	margin-bottom: 50px;
}

.lpVoice__lists {
	width: 96%;
	margin: auto;
}

.lpVoice__list {
	display: flex;
	flex-direction: column;
	margin-bottom: 50px;
}

.lpVoice__list:last-child {
	margin-bottom: 0;
}

.lpVoice__pic {
	width: 100%;
	text-align: center;
	margin-bottom: 15px;
}

.lpVoice__caption {
	width: 100%;
}

.lpVoice__lede {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.75;
	margin-bottom: 15px;
}

.lpVoice__text {
	font-size: 16px;
	line-height: 1.75;
}

.lpVoice__photo {
	margin-bottom: 32px;
}

.lpVoice__name {
	font-size: 16px;
	line-height: 1.5;
}

.lpVoice__name span {
	font-size: 12px;
}

.lpDVD {
	padding: 70px 10px 50px;
}



.lpDVD__sentences {
	margin: 0 auto;
}

.lpDVD__img {
	width: 180px;
	margin:0 auto;
}

.lpDVD__img-sub-txt {
	font-size: 10px;
}

.lpDVD__content {
	display: block;
}

.is-sp {
	display: block;
}

.is-sp-hidden {
	display: none;
}

.lpDVD__container {
	text-align: center;
	padding: 32px 0px 20px;
}

	.lpDVD__title {
		font-size: 24px;
		max-width: 300px;
		width: 100%;
		padding: 3px 0px;
		padding-left: 70px;
		top: 7.5%;
		box-shadow: 0px 1px 4px rgb(0 0 0 / 40%);
	}

	.lpDVD__txt {
		letter-spacing: -2px;
		font-size: 14px;
		font-weight: 500;
	    margin-top: 20px;
	}
	
	.lpDVD__icon {
		max-width: 50px;
	}


	.lpDVD__sub-title {
		font-size: 20px;
		font-weight: 500;
		display: inline;
		line-height: 1.5;
		background: linear-gradient(transparent 70%, #FF9419 50%);
	}

	.lpDVD__txt2 {
		font-size: 20px;
		max-width: 320px;
		margin: 20px auto;
		line-height: 1.4;
		letter-spacing: -1.4px;
	}

	.lpDVD__txt2::before {
		left: 30px;
		top: 10px;
		border-width: 42px 4px 0 10px;
	}
	
	.lpDVD__txt2::after {
		right: 30px;
		top: 10px;
		border-width: 42px 4px 0 10px;
	}

	.lpDVD__button {
		font-size: 14px;
		padding: 6px 40px;
        letter-spacing: -2px;
	}

	.lpDVD__content2 {
		position: relative;
		letter-spacing: -1px;
	}


	.lpDVD__sub-title2 {
		font-size: 14px;
		max-width: 130px;
		padding: 8px 0px;
		margin-bottom: 18px;
		
	}

	.lpDVD__sub-title2::after {
		left: 59%;
		bottom: -20%;
		border-width: 10px 10px 0 10px;
	}


	.lpDVD__right {
		width: 86%;
	}

	.lpDVD__left-flex {
		display: flex;
		width: 100%;
	}

	.lpDVD__left {
		margin-top: 20px;
	}

	.lpDVD__left-head, .lpDVD__right-head{
		font-size: 14px;
		text-align: left;
	}

	.lpDVD__left-sentences {
		display: block;
		line-height: 1.5;
        margin-top: 10px;
	}

	.lpDVD__right-sentences {
        margin-top: 10px;
	}

	.lpDVD__left-txt, .lpDVD__right-txt{
		font-size: 12px;
		margin: 2px 0;
		line-height: 1.5
	}

	.lpDVD__left-txt:last-child {
		margin-left: 0px;
	}

	.lpDVD__container2 {
		margin: 0 auto;
        max-width: 400px;
		width: 100%;
		display: block;
		padding: 0px 20px 30px;
	    text-align: left;
	}

	@media screen and (max-width:360px) {
		.lpDVD__txt2 {
			margin: 13px auto 20px;
		}

		.lpDVD__title {
			font-size: 20px;
			width: 80%;
			padding-left: 60px;
		}
	}

.lpSummary {
	padding: 50px 0;
}

.lpSummary__title {
	font-size: 20px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 20px;
}

.lpSummary__lists {
	width: 96%;
	margin: auto;
}

.lpSummary__list {
	font-size: 18px;
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-bottom: 20px;
}

.lpSummary__head {
	width: 100%;
	text-align: left;
}

.lpSummary__text {
	width: 100%;
	margin-left: 0;
	padding-left: 0;
	margin-top: 8px;
	padding-top: 8px;
	border-left: none;
	border-top: 1px solid #979797;
	line-height: 1.5;
	font-size: 14px;
}

.lpSummary__order {
	padding-left: 1em;
}

.lpSummary__order li {
	list-style-type: decimal
}

.lpSummary__caution {
	font-size: 12px;
}

.lpSummary__flex {
	display: flex;
}

.lpSummary__pic {
	margin-right: 32px;
}

.lpFlow {
	background-color: #0a5bab;
	padding: 20px 0;
	position: relative;
}

.lpFlow::after {
	content: '';
	top: -20px;
	left: 0;
	position: absolute;
	border-style: solid;
	border-width: 0 50vw 20px 50vw;
	border-color: transparent transparent #0a5bab transparent;
}

.lpFlow__title {
	color: #fff;
	font-size: 28px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 20px;
}

.lpFlow__lists {
	width: 96%;
	margin: auto;
}

.lpFlow__list {
	width: 100%;
	background-color: #fff;
	border-top: 4px solid #ff9419;
	box-shadow: 4px 4px 4px 0 rgba(0,0,0,0.6);
	margin-bottom: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	padding: 20px;
	position: relative;
}

.lpFlow__list::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -15px;
	margin-left: -10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 10px 0 10px;
	border-color: #ffffff transparent transparent transparent;
}

.lpFlow__list:last-child::after {
	display: none;
}

.lpFlow__head {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
}

.lpFlow__step {
	border: 4px solid #000;
	width: 64px;
	height: 64px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	font-size: 24px;
	margin-right: 16px;
}

.lpFlow__step span {
	font-size: 18px;
}

.lpFlow__text {
	font-size: 18px;
}

.lpFlow__body {
	font-size: 16px;
}

.lpCatch {
	background: #0a5bab url('/wp-content/themes/jpma-child/common/img/lp/img_lp_catch01.png') center top no-repeat;
	background-size: cover;
	height: 240px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lpCatch__wrap {
	width: 96%;
	margin: auto;
}

.lpCatch__logo {
	display: table;
	padding: 8px 16px;
	background-color: #fff;
	box-shadow: 4px 4px 4px 0 rgba(0,0,0,0.6);
}

.lpCatch__logo > img {
	width: 120px;
	height: auto;
}

.lpCatch__text {
	display: table;
	margin-top: 16px;
	background-color: #fff;
	font-size: 20px;
	font-weight: 700;
	padding: 8px 16px;
	box-shadow: 4px 4px 4px 0 rgba(0,0,0,0.6);
}

.lpForm {
	padding: 50px 0;
}

.lpForm__title {
	font-size: 20px;
	text-align: center;
	margin-bottom: 20px;
}

.lpForm__lede {
	font-size: 14px;
	text-align: center;
	margin-bottom: 20px;
	line-height: 1.5;
}

.lpForm__form {
	width: 96%;
	margin: auto;
}

.lpForm__form th {
	width: 100%;
	background-color: #f3f5f7;
	border: 2px solid #fff;
	vertical-align: middle;
	padding: 10px;
	line-height: 1.5;
	display: block;
}

.lpForm__form td {
	border: 1px solid #fff;
	padding: 10px;
	line-height: 1.5;
	display: block;
}

.lpForm__form .area_btn {
	text-align: center;
}

.lpSection {
	background-color: #f3f5f7;
	padding: 50px 0;
}

.lpSection__wrap {
	border: 4px solid #000;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: column;
	padding: 40px 32px;
	width: 96%;
	margin: auto;
}

.lpSection__wrap--none {
	border: none;
	background-color: #f3f5f7;
}

.lpSection__text {
	font-size: 24px;
	line-height: 1.5;
	margin-bottom: 15px;
}

.lpSection__arrow {
	position: relative;
	border: 4px solid #000;
	font-size: 16px;
	width: 80%;
	height: 44px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.lpSection__arrow .svg-inline--fa {
	margin-right: 16px;
}

.lpSection__arrow::before,
.lpSection__arrow::after{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	margin: auto;
}
.lpSection__arrow::before{
	bottom: -30px;
	right: -4px;
	border-style: solid;
	border-color: #000 transparent transparent transparent;
	border-width: 30px 0 0 15px
}
.lpSection__arrow::after{
	bottom: -15px;
	right: 0;
	border-style: solid;
	border-color: #fff transparent transparent transparent;
	border-width: 30px 0 0 15px
}

.lpSection__wrap--none .lpSection__arrow::after{
	border-color: #f3f5f7 transparent transparent transparent;
}
