.mpd-campaign-block {
	display: flex;
}

.mpd-campaign-block .campaign-img {
	flex-basis: 40%;
}

.mpd-campaign-block .campaign-text {
	flex-basis: 60%;
}

.mpd-campaign-block h3 {
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	margin-bottom: 50px;
	padding-top: 40px;
	margin-top: 0;
	text-decoration: underline;
	text-underline-offset: -0.2em;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-decoration-skip-ink: none;
	line-height: 2.0;
}

p.mpd-marker {
	font-weight: bold;
	font-size: 18px;
	margin-top: 0;
	margin-bottom: 0;
	text-decoration: underline;
	text-underline-offset: -0.2em;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-decoration-skip-ink: none;
	line-height: 1.7;
}

p.mpd-pr-marker {
	font-weight: bold;
	font-size: 20px;
	margin: 20px 0;
	text-decoration: underline;
	text-underline-offset: -0.2em;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-decoration-skip-ink: none;
	line-height: 2.0;
}

h3.mpd-pr-marker {
	font-size: 23px;
	margin-top: 0;
	margin-bottom: 30px;
	font-weight: bold;
	text-decoration: underline;
	text-underline-offset: -0.2em;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-decoration-skip-ink: none;
	line-height: 2.0;
}



/* 幅を狭めるオプション */
.mpd-narrow-width {
	max-width: 800px;
	margin: auto;
}

.mpd-narrow-width figure {
	padding: 0;
}

.mpd-narrow-width h3 {
	font-size: 20px;
}


/* PRエリア　タイトル付きの囲みボックス */
.mpd-pr-titlebox {
	margin: 70px 30px;
	padding: 0.5em 0.5em 40px;
	border-radius: 10px;
	background-color: #ecece7;
}

.mpd-pr-titlebox h3 {
	font-weight: bold;
	padding-bottom: 0.5em;
	text-align: center;
	position: relative;
	font-size: 23px;
	margin-bottom: 40px;
}

.mpd-pr-titlebox h3::after {
	content: '';
	background-color: rgb(var(--image-color-accent));
	width: 2em;
	height: 5px;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

.mpd-pr-titlebox h4 {
	font-weight: bold;
	margin: 0 20px;
	padding-top: 20px;
}

/* 文字強調用 */
.strong-option {
	font-weight: bold;
	font-size: 150%;
	color: rgb(var(--image-color-accent));
}

/* PRエリア　タイトル付きの囲みボックスの中のリスト */
.mpd-pr-titlebox ul li {
	border-bottom: dashed 2px #fff;
	padding-left: 20px;
	font-size: 18px;
	line-height: 1.5;
	padding-left: 1.3em;
	text-indent: -1.0em;
	margin-bottom: 10px;
}

.mpd-pr-titlebox ul {
	list-style: none;
	max-width: 700px;
	margin: auto;
	padding: 0;
}

.mpd-pr-titlebox ul li:before {
	content: '';
	display: inline-block;
	width: 0.5em;
	height: 0.5em;
	border-radius: 50%;
	vertical-align: middle;
	margin-right: 0.5em;
	background: #666;
}


.mpd-box-typeA {
	margin: 4em auto 3em;
	padding: 2em;
	border-left: double 5px #999fad;
	border-right: double 5px #999fad;
	background-color: #f1f3f4;
	box-shadow: 3px 1px 4px rgba(0, 0, 0, 0.2);
	width: 80%;
}

.mpd-box-typeA h3 {
	margin-top: 20px;
}

.mpd-flex {
	display: flex;
}

.mpd-flex .flex-img {
	flex-basis: 35%;
}

.mpd-flex .flex-text {
	flex-basis: 65%;
}

.mpd-flex .flex-img figure {
	min-width: 200px;

}

.common-pr-point {
	background-color: #fff;
	border: none;
}

/* 番号リスト */

.common-pr-point ol {
	counter-reset: list;
	list-style-type: none;
	padding: 0px;
	padding-left: 20px;
	max-width: 700px;
	margin: auto;
}

.common-pr-point ol li {
    margin: 7px 10px 15px 30px;
}
.common-pr-point ol li p {
	font-weight: normal;
}

.common-pr-point ol li:before {
	counter-increment: list;
	content: counter(list);
	position: absolute;
	left: -35px;
	width: 30px;
	height: 30px;
	top: 15px;
	background: rgb(var(--image-color-accent));
	text-align: center;
	color: #fff;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);

	background: rgb(var(--image-color-accent));
	border: rgb(var(--image-color-accent)) 1px solid;

	border-radius: 50%;
}

.common-pr-point .mpd-button {
	text-align: right;
	padding-right: 30px;
}

.common-pr-point a {
	color: inherit;
	text-decoration: none;
	font-size: 16px;
	padding: 0 .5em .2em;
}

.common-pr-point a {
	background:
		linear-gradient(to right,
			rgb(var(--image-color-accent)),
			rgb(var(--image-color-accent))),
		linear-gradient(to right,
			rgba(200, 200, 200, 1),
			rgba(100, 200, 200, 1));
	background-size: 100% 3px, 0 3px;
	background-position: 100% 100%, 0 100%;
	background-repeat: no-repeat;
	transition: background-size 400ms;
}

.common-pr-point a:hover {
	color: inherit;
	background-size: 0 3px, 100% 3px;
}

/* CTAボタン */

.cta_btn {
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.1em;
	align-items: center;
	display: flex;
	justify-content: right;
	gap: 20px;
	flex-wrap: wrap;
	position: absolute;
	bottom: 8%;
	right: 0;
	width: 100%;
	padding-right: 50px;
}

.cta_btn01,
.cta_btn02 {
	font-size: 16px;
	color: #fff;
	position: relative;
	display: inline-block;
	text-decoration: none;
	padding: 1em 1em 1em 60px;
	border-radius: 100vh;
	width: 100%;
	max-width: 300px;
	transition: all .2s;
	box-shadow: 0 3px 5px rgb(0 0 0 / 50%);

}

/* ボタンの色 */
.cta_btn01 {
	background: rgb(var(--image-color-accent));
}

.cta_btn02 {
	background: rgb(var(--image-color-accent));
}

.cta_btn01::before,
.cta_btn02::before {
	content: '';
	position: absolute;
	left: 30px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	background-repeat: no-repeat;
	background-size: cover;
}

/* カタログアイコン */
.cta_btn01::before {
	width: 40px;
	height: 40px;
	background-image: url(mpd_img/catalog-icon.png);
}

/* ダウンロードアイコン */
.cta_btn02::before {
	width: 40px;
	height: 40px;
	background-image: url(img/trial-icon.png);
}

.cta_btn img {
	width: 1em;
	margin-right: 0.5em;
}

/* マウスオーバー時 */
.cta_btn01:hover,
.cta_btn02:hover {
	box-shadow: none;
	transform: scale(0.99, 0.99) translateY(2px);
}

.cta_btn-copy {
	font-size: 90%;
	font-weight: bold;
	color: initial;
	position: absolute;
	top: -2em;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	width: 100%;
}

.cta_btn-copy:before {
	margin-right: .2rem;
	content: '＼';
}

.cta_btn-copy:after {
	margin-left: .1rem;
	content: '／';
}

.mpd-top-title-area {
	position: relative;
}



      /* 広告誘導ページ全体の設定 */
      .mpd-adland h2 {
		text-align: center;
		display: block;
		font-size: 26px;
		color: rgb(var(--image-color));
		line-height: 1.6em;
		padding: 1em 1.5em 0.25em;
		font-weight: bold;
		margin: 0 0 20px;
	 }

	 .mpd-adland {
		margin: 0 0 50px 0;
		text-align: center;
		justify-content: center;
		align-items: center;
		padding: 40px 10px 0;
	 }

	 .mpd-adland p {
		font-size: 16px;
		display: block;
		margin: 20px auto;
		padding-left: 30px;
		padding-right: 30px;
		text-align: justify;
		line-height: 1.7;
	 }

	 .mpd-adland ul {
		padding: 0.5em;
	 }

	 .mpd-adland ul li {
		text-align: justify;
		font-size: 16px;
		line-height: 1.5;
		margin: .7em 0 .7em 1em;
	 }

	 .mpd-adland img {
		max-width: 100%;
		padding: 0px;
		margin: auto;
	 }

	 .background {
		background-color: #e3f1ff;
		border-radius: 10px;
		padding-bottom: 30px;
	 }

	 .sp {
		display: none !important;
	 }

	 .pc {
		display: block !important;
	 }

	 /* 特長 */
	 .mpd-feature-wrap img {
		margin-top: 30px;
		margin-bottom: 100px;
		max-width: 90%;
	 }

	 .mpd-feature {
		position: relative;
		margin: 40px -10px 15px;
		padding: 25px 10px 10px;
		background: linear-gradient(to left, #3f9ab9, #7bc9fa);
	 }

	 .mpd-feature-num {
		position: absolute;
		top: -25px;
		left: 10px;
		width: 150px;
		height: 50px;
		padding: 13px 0 10px 5px;
		font-size: 18px;
		color: white;
		font-weight: bold;
		text-align: center;
		letter-spacing: 0.2em;
		line-height: 1.1;
		border-radius: 3px;
		background: linear-gradient(135deg, #007891, #10505d);
	 }

	 .mpd-feature h2 {
		margin-bottom: 0;
		padding: 0.25em 1.8em 0.25em 1.5em;
		color: white;
		text-align: left;
		font-weight: normal;
		font-size: 25px;
	 }

	 /* 中央に線があるレイアウト */
	 .center-line {
		display: flex;
		margin-bottom: 70px;
		margin-top: 50px;
		text-align: center;
	 }

	 .center-line div {
		width: 100%;
	 }

	 .center-line p {
		text-align: justify;
	 }

	 .center-line img {
		max-width: 200px;
	 }

	 .center-line h3 {
		border-bottom: none;
		text-align: center;
		color: #555;
		font-size: 20px;
		font-weight: bold;
		border-left: 0px solid;
		margin: 5px;
		padding: 0;
		display: block;
		line-height: 1.2;
	 }


	 .center-line-left {
		flex-grow: 1;
		position: relative;
		margin-right: 2em;
		padding: 0 40px 0 0;
	 }

	 .center-line-right {
		flex-grow: 1;
		position: relative;
		padding: 0 0 0 40px;
	 }

	 .center-line-left::after {
		position: absolute;
		top: 0;
		left: 100%;
		margin: 0 1rem;
		content: "";
		width: 1px;
		height: 100%;
		background-color: #333;
	 }

	 p.center-line-btn {
		margin: 0 30px 20px;
		padding: 15px 20px 10px 20px;
		border: 1px solid rgb(var(--image-color));
		text-align: center;
		border-radius: 6px;
		display: block;
		background-color: rgb(var(--image-color));
		text-decoration: none;
		transition: 0.3s ease-in-out;
	 }

	 p.center-line-btn a {
		color: #fff;
		font-weight: bold;
		display: block;
	 }

	 p.center-line-btn:hover {
		background-color: #fafafa;
		transition: 0.3s ease-in-out;
	 }

	 p.center-line-btn:hover a {
		color: rgb(var(--image-color));
		transition: 0.3s ease-in-out;

	 }



	 /* 吹き出し付きの囲み */
	 .mpd-hukidashi {
		position: relative;
		margin: 3em auto;
		padding: 2em;
		border: 2px solid #7e9cc5;
		border-radius: 10px;
		max-width: 800px;
	 }

	 .mpd-hukidashi>.hukidashi-text {
		position: absolute;
		top: -1.15em;
		left: .5em;
		padding: .4em 1.4em;
		border-radius: 25px;
		background-color: #7e9cc5;
		color: #fff;
		font-size: 1.2em;
	 }

	 .mpd-hukidashi>.hukidashi-text::before {
		position: absolute;
		bottom: -8px;
		left: 50%;
		transform: translateX(-50%);
		width: 16px;
		height: 8px;
		background-color: #7e9cc5;
		clip-path: polygon(0 0, 100% 0, 50% 100%);
		content: '';
	 }


	 .mpd-hukidashi h2 {
		text-align: left;
		padding: 0.25em 1.5em 0.25em 0;
		margin-bottom: 0;
	 }

	 .mpd-hukidashi .flex-img {
		display: flex;
		justify-content: center;
	 }

	 .mpd-hukidashi .flex-img img {
		max-width: 200px;

	 }


	 /* 機能ページリスト　grid */
	 .mpd-adland-grid {
		display: grid;
		margin: 50px 10px 30px;
		padding: 0;
		gap: 10px;
		grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	 }

	 .mpd-adland-grid-item img {
		max-width: 150px;
	 }

	 .mpd-adland-grid-item p {
		padding: 0 10px;
		font-size: 16px;
		font-weight: bold;
		line-height: 1.5em;
		color: rgb(var(--image-color));
		text-decoration: none;
		text-align: center;
	 }

	 .mpd-adland-grid-item :hover {
		opacity: .7;
	 }

	 /* こんな場面で使われています flex*/

	 .mpd-adland-flex-items {
		padding: 30px 20px 0;
	 }

	 .mpd-adland-flex-item {
		display: flex;
		justify-content: space-between;
		background: white;
		border-radius: 10px;
		padding: 30px 40px;
		margin: 0 auto;
		max-width: 900px;
	 }

	 .mpd-adland-flex-item:not(:last-child) {
		margin-bottom: 50px;
	 }


	 .mpd-adland-flex-item-img {
		width: 35%;
		align-items: center;
		padding-right: 10px;
		display: flex;
		justify-content: center;
	 }

	 .mpd-adland-flex-item-img img {
		max-width: 200px;
	 }

	 .mpd-adland-flex-item-txt {
		width: 65%;
	 }

	 .mpd-adland-flex-item-txt h4 {
		font-size: 18px;
		padding: 10px 0 0;
		text-align: left;
		font-weight: bold;
	 }

	 .mpd-adland-flex-item-txt p {
		line-height: 1.5;
	 }

	 /* マーカー調整 */
	 h3.mpd-pr-marker {
		padding-top: 30px;
	 }

	 /* 囲み枠（しおりがあれば！） */
	 .mpd-box-cross {
		height: auto;
		max-width: 800px;
		margin: 2em auto;
		position: relative;
		padding: 0.5em 1.5em;
		border-top: solid 3px #f3a221;
		border-bottom: solid 3px #f3a221;
	 }

	 .mpd-box-cross:before,
	 .mpd-box-cross:after {
		content: '';
		position: absolute;
		top: -10px;
		width: 3px;
		height: -webkit-calc(100% + 20px);
		height: calc(100% + 20px);
		background-color: #f3a221;
	 }

	 .mpd-box-cross:before {
		left: 10px;
	 }

	 .mpd-box-cross:after {
		right: 10px;
	 }

	 .mpd-box-cross p {
		margin: 0;
		padding: 0;

	 }

	 .mpd-box-cross img {
		position: absolute;
		opacity: .4;
		z-index: 0;
		max-width: 300px;
		margin: auto;
		display: block;
		top: 60%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
	 }

	 .mpd-box-cross-txt {
		position: relative;
		padding: 1em;
		z-index: 10;
		background: rgba(250, 249, 235, 0.2);
	 }

	 .mpd-box-cross ul {
		padding: 0 4em;
	 }

	 .mpd-box-cross ul li {
		color: #333;
		font-size: 18px;
		line-height: 1.7;
	 }
	 .mpd-margin{
		margin: 70px auto;
	 }

	 .mpd-kakomi-wrapper {
		position: relative;
		width: 98%;
	}
	
	.mpd-kakomi {
		padding: 1.5em 0.5em 1em 1.5em;
		background: none;
		border: 2px solid rgb(var(--image-color-accent));
		position: relative;
		/* border-radius: 10px; */
	}
	
	.mpd-kakomi-background {
		background-color: #f6f7d9;
		position: absolute;
		top: 8px;
		left: 8px;
		width: calc(100% + 1px);
		height: calc(100% + 1px);
		border-radius: 10px;
	}


@media screen and (max-width:1050px) {


	/* CTAボタン */
	.cta_btn {
		bottom: 7%;
	}

	.cta_btn01,
	.cta_btn02 {
		font-size: 14px;
		padding: .5em .7em;
		max-width: 200px;
	}

	.cta_btn01::before,
	.cta_btn02::before {
		display: none;
	}

	.cta_btn-copy {
		font-size: 85%;
	}

}


@media screen and (max-width:640px) {
	.mpd-campaign-block {
		display: block;
	}

	.mpd-campaign-block .campaign-img figure {
		max-width: 300px;
		margin: auto;
		padding: 0;
	}

	.mpd-campaign-block h3 {
		font-size: 18px;
	}

	p.mpd-marker {
		font-size: 18px;
	}


	/* PRエリア　タイトル付きの囲みボックス */
	.mpd-pr-titlebox {
		margin: 80px 10px;
	}

	.mpd-pr-titlebox ul li {
		font-size: 15px;
	}

	.mpd-pr-titlebox ul {
		margin: auto 20px;
	}

	.mpd-narrow-width h3 {
		font-size: 18px;
	}

	.mpd-pr-titlebox h3 {
		font-size: 16px;
		margin: 30px 10px;
	}

	.mpd-pr-titlebox h3::after {
		height: 3px;
	}


	.mpd-flex {
		display: block;
	}

	.mpd-flex .flex-img figure {
		max-width: 300px;
		margin: auto;
		padding: 0;
	}

	.mpd-box-typeA {
		padding: 1em;
		width: 90%;
	}

	.mpd-box-typeA h3 {
		margin-bottom: 40px;
		font-size: 16px;
	}

	.mpd-box-typeA p{
		padding-left: 10px;
		padding-right: 10px;
	}
	.mpd-box-typeA ul{
		padding-left: 10px;
		padding-right: 10px;
		margin: 10px;
	}

	.mpd-flex p {
		padding-left: 10px;
		padding-right: 10px;
	}

	.common-pr-point-flex img {
		margin: 20px auto auto;
	}

	
	.common-pr-point {
		margin-bottom: 0;
	}

	h3.mpd-pr-marker {
		font-size: 18px;
	}

	/* 広告誘導ページ用 */

	.sp {
		display: block !important;
	 }

	 .pc {
		display: none !important;
	 }

	 .mpd-adland {
		margin-bottom: 30px;
	 }


	 .mpd-adland h2 {
		font-size: 23px;
	 }

	 .mpd-adland p {
		margin: 15px auto;
		padding-left: 1.0em;
		padding-right: 1.0em;
	 }

	 .background {
		border-radius: 0;
	 }


	 /* 吹き出し付きの囲み */
	 .mpd-hukidashi {
		padding: 2em 1em;
		margin-bottom: 0;
	 }

	 .mpd-hukidashi h2 {
		text-align: center;
		padding: 0.25em;
	 }

	 /* 特長 */

	 .mpd-feature-wrap img {
		margin-top: 15px;
		margin-bottom: 50px;
		max-width: 100%;
	 }

	 .mpd-feature h2 {
		font-size: 20px;
		padding: 0.25em 0.7em 0.25em 0.7em;
		line-height: 1.4;
	 }

	 .mpd-feature-num {
		width: 120px;
		height: 40px;
		font-size: 16px;
		letter-spacing: 0.15em;
		line-height: 1;
	 }


	 /* 中央に線があるレイアウト */
	 .center-line {
		display: block;
		margin: 0 10px;
	 }

	 .center-line div {
		width: 100%;
		padding: 1em;
		background-color: #eaf5ff;
		border-radius: 10px;
	 }

	 .center-line img {
		max-width: 100px;
	 }

	 .center-line p {
		padding: 0 30px;
	 }

	 p.center-line-btn {
		padding: 15px 20px 10px 20px;
	 }

	 .center-line-left {
		margin-bottom: 50px;
	 }

	 .center-line-left::after {
		display: none;
	 }

	 /* こんな場面で使われています flex*/

	 .mpd-adland-flex-item {
		flex-direction: column;
		align-items: center;
		padding: 30px 20px;
	 }

	 .mpd-adland-flex-item:nth-child(odd) {
		flex-direction: column;
	 }

	 .mpd-adland-flex-item-img {
		width: 100%;
		padding-bottom: 30px;
	 }

	 .mpd-adland-flex-item-txt {
		width: 100%;
	 }

	 .mpd-adland-flex-item-txt h4 {
		text-align: center;
	 }

	 /* 機能ページリスト　grid */
	 .mpd-adland-grid {
		display: grid;
		margin: 50px 10px 30px;
		padding: 0 20px;
		gap: 30px;
		grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	 }

	 .mpd-adland-grid-item img {
		max-width: 120px;
	 }

	 /* 囲み枠（しおりがあれば！） */

	 .mpd-box-cross-txt {
		padding: 1em 0;
	 }
	 .mpd-box-cross ul {
		padding: 0 1em;
	 }

	 .mpd-box-cross ul li {
		font-size: 16px;
		line-height: 1.5;
	 }

	 .mpd-box-cross img {
		max-width: 200px;
	 }

}

@media screen and (max-width:450px) {


	/* CTAボタン */
	.cta_btn {
		bottom: 7%;
		gap: 5px;
	}

	.cta_btn01,
	.cta_btn02 {
		font-size: 10px;
		padding: .3em .5em;
		max-width: 140px;
	}

	.cta_btn-copy {
		display: none;
	}
}