/********************************************************
 *** APEXアフィリエイト
 ********************************************************/

/*** 全体 ***/
html {
	height: 100%;
}
body {
	margin: 0px;
	height: 100%;
	color: #000;
	font-size: 9pt;
	background: #FFFFFF;
	-webkit-text-size-adjust: none;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
a {
	color: #000;
}
a:link {
	color: #000;
}
a:visited {
	color: #000;
}
a:hover {
	color: #000;
}
a:active {
	color: #000;
}
img {
	border-width: 0px;
}
#base {
	position: relative;
	overflow: auto;
	width: 100%;
	min-height: 100%;
}
#main {
	position: relative;
	margin: 0px auto;
	padding: 0px 20px;
	max-width: 860px;
	line-height: 1.5;
}
#menu-check {
	display: none;
}
#main-head {
	position: relative;
	height: 70px;
}
#main-head .header-pc::before {
	position: absolute;
	left: 180px;
	bottom: 11px;
	content: "アペックスアフィリエイトシステム   Since 2003";
	font-size: 11pt;
	font-weight: bold;
	white-space: pre-wrap;
}
#main-head .header-pc.provider::before {
	content: "DUGAコンテンツ配信プラットフォーム   Since 2006";
}
#main-head .header-pc::after {
	position: absolute;
	top: 15px;
	right: -7px;
	line-height: 1.2;
	content: "運営者: 有限会社APEX \A 福岡市博多区豊1-5-24 \A 092-481-0570（代表）";
	color: #666;
	white-space: pre;
}
#main-head .logo-apex {
	margin-top: 10px;
	width: 143px;
	height: 51px;
	vertical-align: text-bottom;
}
#main-left {
	float: left;
	padding-bottom: 40px;
	width: 160px;
}
#main-left .menutitle {
	margin-bottom: 4px;
}
#main-left .menutitle a, 
#main-left .menutitle span {
	display: block;
	padding: 5px 6px;
	background-color: #666;
	color: #FFFFFF;
	font-size: 10pt;
	font-weight: bold;
}
#main-left .title {
	margin-bottom: 4px;
}
#main-left .title a {
	display: block;
	padding: 5px 8px;
	background-color: #EEE;
	border: 1px solid #DDD;
	text-decoration: none;
	transition: all 200ms linear;
}
#main-left .title a:hover {
	background-color: #DDD;
	border-color: #CCC;
}
#main-left .space {
	margin-bottom: 8px;
}
#main-left > div:last-child {
	margin-bottom: 0px;
}
@media (min-width: 1px) {
	#main-left .menutitle .icon {
		padding-left: 26px;
		background-repeat: no-repeat;
		background-size: 15px 15px;
		background-position: 7px 50%;
	}
	#main-left .toppage {
		background-image: url(/aff/img/icon/toppage.svg);
	}
	#main-left .wakaba {
		background-image: url(/aff/img/icon/wakaba.svg);
	}
	#main-left .system {
		background-image: url(/aff/img/icon/system.svg);
	}
	#main-left .info {
		background-image: url(/aff/img/icon/info.svg);
	}
	#main-left .support {
		background-image: url(/aff/img/icon/support.svg);
	}
	#main-left .basic {
		background-image: url(/aff/img/icon/basic.svg);
	}
	#main-left .sozai {
		background-image: url(/aff/img/icon/sozai.svg);
	}
	#main-left .logouti {
		background-image: url(/aff/img/icon/logout.svg);
	}
}
#main-right {
	margin-left: 180px;
	padding-bottom: 50px;
	height: 100%;
	box-sizing: border-box;
}
#main-footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 50px;
}
#main-footer .copyright {
	width: 640px;
	margin: 0px auto;
	padding-left: 150px;
	line-height: 50px;
	color: #999;
	font-weight: bold;
	text-align: center;
}
#main-footer img {
	width: 595px;
	height: 20px;
	border: none;
}
.contents {
	overflow: hidden;
	display: table;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	/*background: #EEE;*/
}
.contents > div:last-child, 
.contents > table:last-child {
	margin-bottom: 0px !important;
}
.contents .pagetitle {
	margin-bottom: 15px;
	padding: 5px 8px;
	background: #333;
	color: #FFF;
	font-size: 10pt;
	font-weight: bold;
}
.contents .title {
	overflow: hidden;
	margin: 15px 0px;
	border-bottom: solid 2px;
	color: #333;
	font-size: 11pt;
	font-weight: bold;
}
.contents .title div[style*="right"] a.link {
	position: relative;
	padding-right: 14px;
	font-size: 10pt;
	text-decoration: none;
	vertical-align: 1px;
}
.contents .title div[style*="right"] a.link::after {
	position: absolute;
	top: 50%;
	right: 4px;
	margin-top: -3pt;
	width: 6px;
	height: 6px;
	content: "";
	border-top: 2px solid #333;
	border-right: 2px solid #333;
	transform: rotate(45deg);
}
.contents .subtitle {
	margin-bottom: 10px;
	color: #333;
	font-size: 10pt;
	font-weight: bold;
}
.contents .infotitle {
	overflow: hidden;
	margin: 10px 0px 0px 0px;
	color: #333;
	font-size: 10pt;
	font-weight: bold;
}
.contents .infotitle .text {
	float: left;
	margin-top: 5px;
	padding: 0 10px 0 5px;
	border-left: solid 5px #F00;
}
.contents .infotitle .date {
	float: right;
	margin-top: 5px;
	color: #666;
	font-weight: normal;
}
.contents .infodesc {
	overflow: hidden;
	margin: 10px 0px;
}
.contents .info-rapper {
	margin-top: -5px;
}
.info-rapper .infodesc:not(:last-child) {
	padding: 0 0 14px 0;
	border-bottom: solid 1px #CCC;
}
.info-rapper .infodesc:last-child {
	margin-bottom: 0px;
}
.contents .infodesc > p {
	margin-top: 0px;
	margin-bottom: 6px;
}
.contents .infodesc > p:last-child {
	margin-bottom: 0px;
}
.contents .infodesc .subtitle {
	padding: 0px;
	color: #333;
}
.contents .infodesc > div {
	margin-bottom: 10px;
}
.contents .infodesc > div:last-child {
	margin-bottom: 0px;
}
.contents .infodesc img {
	vertical-align: text-bottom;
}
.contents .infodesc .table-standard {
	margin: 0px;
	width: 100%;
}
.contents .infodesc .table-standard td {
	padding: 3px 5px;
}
.contents .infodesc .table-standard a {
	display: inline-block;
}
.contents .infodesc .table-standard + p {
	margin-top: 8px;
}
.contents .infodesc .labelinfo {
	width: calc(100% - 190px);
}
.contents .infodesc .labelinfo thead td {
	text-align: center;
}
.contents .infodesc .labelinfo tbody td {
	text-align: right;
}
.contents .infodesc .labelinfo thead td:nth-of-type(1), 
.contents .infodesc .labelinfo thead td:nth-of-type(3) {
	width: 30%;
}
.contents .infodesc .labelinfo thead td:nth-of-type(2), 
.contents .infodesc .labelinfo thead td:nth-of-type(4) {
	width: 15%;
}
.contents .infodesc .leftbox {
	float: left;
	margin-right: 10px;
}
.contents .infodesc .leftbox img[src*="/ban/190-90/"] {
	width: 178px;
	height: 84px;
}
.contents .infodesc .rightbox {
	float: right;
	margin-left: 10px;
}
.contents .infodesc blockquote {
	position: relative;
	margin: 10px 0px;
	padding: 8px 30px;
	border: solid 0.5px #CCC;
	border-left-width: 5px;
	background: #F6F6F6;
	opacity: 0.8;
}
.contents .infodesc blockquote::before {
	position: absolute;
	top: 8px;
	left: -10px;
	width: 32px;
	line-height: 32px;
	content: "“";
	color: #666;
	font-family: serif;
	font-size: 32px;
	text-align: right;
}
.contents .infodesc blockquote::after {
	position: absolute;
	bottom: -10px;
	right: -10px;
	width: 32px;
	line-height: 32px;
	content: "”";
	color: #666;
	font-family: serif;
	font-size: 32px;
	text-align: left;
}
.contents .breadcrumbs {
	margin: 15px 0px;
}
.contents .breadcrumbs img {
	vertical-align: text-top;
}
.contents .space {
	margin-bottom: 10px;
}
.contents .space img {
	vertical-align: text-bottom;
}
.contents .sozai {
	background-color: #FFF;
	margin: 10px;
	padding: 8px 8px 2px 8px;
	border: 1px solid #DDD;
	clear: both;
	overflow: hidden;
}
.contents .sozai-left {
	float: left;
	margin-right: 8px;
	width: 100px;
	height: 100px;
}
.contents .sozai-right {
	line-height: 1.3;
	padding-bottom: 5px;
}
.contents .labelbox {
	overflow: hidden;
	margin: 0px -10px -10px 0px;
}
.contents .label {
	background-color: #FFF;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}
.contents .labelname {
	position: relative;
	margin-bottom: 2px;
	padding: 4px 2px 2px 12px;
	background-color: #333;
	color:#FFF;
	font-size: 8pt;
}
.contents .labelname:before {
	content: "";
	position: absolute;
	width: 5px;
	height: 10px;
	top: 50%;
	left: 4px;
	margin-top: -5px;
	background: #D33;
}
.contents .labelname a, 
.contents .labelname span {
	overflow: hidden;
	display: block;
	max-width: 140px;
	color: #FFF;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.contents .labelban {
	width: 147px;
	height: 69px;
}
.contents .labelban img {
	width: 147px;
	height: 70px;
}
@media (min-width: 1px) {
	.contents .labelname a, 
	.contents .labelname span {
		width: calc(20vw - 48px);
	}
	.contents .labelban {
		width: calc(25vw - 67px);
		height: calc((25vw - 67px) * 0.47);
		max-width: 162.2px;
		max-height: 76.8px;
	}
	.contents .labelban img {
		width: 100%;
		height: auto;
	}
}
.contents .labelday {
	margin-top: 4px;
	color: #666;
	text-align: center;
}
.contents .attention {
	margin: 10px 0px;
	padding: 10px 10px;
	background-color: #FEE;
}
.contents .red {
	color: #FF0000;
	margin-bottom: 5px;
	font-weight: bold;
}
.contents .indent {
	margin-left: 12px;
}
.contents .error {
	margin: 15px 0px;
	border: 2px solid #C00;
	color: #C00;
	background-color:#FEE;
	padding: 6px 8px;
}
.contents .error a {
	color: #C00;
}
.contents .input {
	margin: 10px 0px;
	text-align: center;
}
.contents .input > input[type="submit"] {
	width: 48%;
}
input[type="text"], 
input[type="url"], 
input[type="email"], 
input[type="tel"], 
input[type="password"], 
select, textarea {
	border: solid 1px #999;
	padding: 4px 6px;
	box-sizing: border-box;
	font-size: 9pt;
}
select {
	padding: 2.5px 5px;
	min-height: 24px;
}
textarea {
	width: 100%;
	resize: vertical;
	vertical-align: text-bottom;
}
input#form {
	margin: 5px;
	vertical-align: -1.5px;
}
.blank_link {
	width: 15px;
	height: 11px;
	margin: 1px 0px 0px 2px;
	vertical-align: text-top;
}
.form-table {
	border: 1px solid #CCC;
	background-color: #EEE;
	margin: 10px 0px;
	padding: 8px;
}
.wait:focus {
	cursor: wait;
}
.icon_new {
	display: inline-block;
	height: 13px;
	line-height: 14px;
	padding: 0px 2px;
	text-align: center;
	background: #FF8000;
	font-size: 8pt;
	color: #FFF;
}

/*** リスト（黒丸マーカー） ***/
ul.disc {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	line-height: 1.4;
}
ul.disc li {
	position: relative;
	margin-top: 2px;
	padding-left: 1em;
	text-indent: 0px;
}
ul.disc li:first-child {
	margin-top: 0px;
}
ul.disc li:before {
	content: "\0030fb";
	position: absolute;
	display: table;
	text-align: center;
	width: 1em;
	left: -0.3em;
	font-size: 200%;
	line-height: 70%;
}
ul.subtitle.disc {
	margin-bottom: 4px;
}

/*** アイコンリスト（お知らせ） ***/
ul.icon li {
	padding-left: 18px;
}
ul.icon li:before {
	top: 1px;
	left: 0;
	width: 15px;
	height: 15px;
	content: "";
	background-repeat: no-repeat;
	background-size: 15px 15px;
}
ul.icon li.period:before {
	background-image: url(https://img.duga.jp/img/icon/svg/clock.svg);
}
ul.icon li.target:before {
	background-image: url(https://img.duga.jp/img/icon/svg/check.svg);
}
ul.icon li.rate:before {
	background-image: url(https://img.duga.jp/img/icon/svg/money.svg);
}
ul.icon li.stop:before {
	background-image: url(https://img.duga.jp/img/icon/svg/stop.svg);
}
ul.icon li.stop-color:before {
	background-image: url(https://img.duga.jp/img/icon/svg/stop-color.svg);
}
ul.icon li.prohibition:before {
	background-image: url(https://img.duga.jp/img/icon/svg/prohibition.svg);
}
ul.icon li.prohibition-color:before {
	background-image: url(https://img.duga.jp/img/icon/svg/prohibition-color.svg);
}
ul.icon li.link:before {
	background-image: url(https://img.duga.jp/img/icon/svg/link.svg);
}
ul.icon li.source:before {
	background-image: url(https://img.duga.jp/img/icon/svg/office.svg);
}
ul.icon li.phone:before {
	background-image: url(https://img.duga.jp/img/icon/svg/phone.svg);
}
ul.icon li.mail:before {
	background-image: url(https://img.duga.jp/img/icon/svg/mail.svg);
}
.contents .infodesc > ul.icon + p {
	margin-top: 6px;
}

/*** PRプレイス ***/
.pr-place .infotitle .text {
	border-color: #0792c5;
}
.pr-place .infodesc .table-standard td {
	padding: 6px;
}
.pr-place ul.icon {
	margin-top: 10px;
}
.pr-place ul.icon li > * {
	display: inline-block;
	margin-right: 8px;
}
.contents .pr-place .infodesc blockquote {
	opacity: 1;
}
.pr-place blockquote p {
	margin: 8px 0;
}
.what-pr {
	margin: 15px 0px 10px 0px;
	padding-bottom: 14px;
	border-bottom: solid 1px #CCC;
	text-align: right;
}
.what-pr a {
	position: relative;
	display: inline-block;
	padding: 2px 8px 2px 20px;
	line-height: 18px;
	border-radius: 12px;
	background: #0792c5;
	color: #FFF;
	text-decoration: none;
	transition-property: opacity;
	transition-duration: .15s;
	opacity: .9;
}
.what-pr a:hover {
	opacity: .7;
}
.what-pr a:before {
	position: absolute;
	top: 4px;
	left: 5px;
	width: 14px;
	height: 14px;
	content: "";
	background-image: url(/aff/img/icon/add.svg);
	background-size: 14px 14px;
	opacity: 0.85;
}

/*** ボタン（標準グレー） ***/
.button {
	display: inline-block;
	padding: 0px 15px;
	height: 30px;
	line-height: 28px;
	background: #EEE;
	background-image: linear-gradient(to bottom,#F7F7F7,#EEE,#EEE,#E5E5E5);
	border: 1px solid #666;
	border-radius: 3px;
	box-sizing: border-box;
	color: #333;
	font-size: 9pt;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
.button:hover {
	background: #E5E5E5;
	background-image: linear-gradient(to bottom,#EEE,#E5E5E5,#E5E5E5,#DDD);
	border: 1px solid #555;
	color: #222;
}
.button:focus {
	color: #999 !important;
	border-color: #AAA;
}
table .button {
	height: 24px;
	line-height: 22px;
	padding: 0px 10px;
}

/*** 矢印（標準グレー） ***/
.arrowgray {
	background-image: url('/img/arrow_gray.gif');
	background-repeat: no-repeat;
	background-position: 0 45%;
	padding-left: 10px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),(min-resolution: 144dpi) {
	.arrowgray {
		background-image: url('/img/arrow_gray_x2.gif');
		background-size: 5px 8px;
	}
}

/*** 矢印（モアリンク） ***/
.morelink {
	position: relative;
	float: right;
	display: inline-block;
	text-decoration: none;
	border-bottom: solid 1px;
	line-height: 10px;
}
@media (min-width: 1px) {
	.morelink {
		margin-right: 16px;
	}
}
.morelink::after {
	content: ">";
	position: absolute;
	top: -2px;
	right: -16px;
	bottom: -1px;
	width: 12px;
	color: #FFF;
	background: #999;
	border-radius: 2px;
	font-size: 10px;
	text-align: center;
	line-height: 12px;
}

/*** ページング ***/
.paging-box {
	margin: 10px 0px 0px 4px;
}
.paging {
	padding: 2px;
}

/*** 可変コンテンツの縦横比保持 ***/
.variable {
	position: relative;
}
.variable::before {
	display: block;
	content: "";
}
.variable.x12\%::before {
	padding-top: 12%;
}
.variable.x17\%::before {
	padding-top: 17%;
}
.variable.x20\%::before {
	padding-top: 20%;
}
.variable img {
	width: 100%;
}
@media (min-width: 1px) {
	.variable img {
		position: absolute;
		top: 0;
		bottom: 0;
	}
}

/*** 幅狭スクリーン（モバイル）にのみ表示する要素 ***/
.mobile-only {
	display: none;
}
@media screen and (max-width: 500px) {
	.mobile-only {
		display: initial;
	}
}

/********************************************************
 *** 広告素材ページ
 ********************************************************/

.sozai-title {
	margin-bottom: 4px;
	font-size: 10pt;
	font-weight: bold;
	clear: both;
}
.sozai-contents {
	overflow: hidden;
	margin: 0px 0px 10px 0px;
}
.sozai-contents:not(:last-of-type) {
	border-bottom: dotted 1px #CCC;
}
.sozai-50on {
	float: left;
	margin: 0px 6px 15px 0px;
}
.sozai-50on:last-child {
	margin: 0px;
}
.sozai-category {
	float: left;
	margin: 0px 6px 6px 0px;
}
.sozai-category:last-child {
	margin: 0px 6px 15px 0px;
}
.sozai-contents .banner {
	float: left;
	margin: 0 10px 10px 0;
}
.sozai-contents .banner img {
	width: 160px;
	height: 75px;
	vertical-align: text-bottom;
}
.sozai-link {
	margin: 0 0 10px 170px;
}
.labelintro {
	margin-bottom: 6px;
	min-height: 54px;
}
.icon-autorenewal {
	padding: 0px 8px;
	color: #FFF;
	font-size: 8pt;
	font-weight: normal;
	background-color: red;
	border-radius: 10px;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
}
.icon-timely {
	padding: 0 8px;
	color: #FFF;
	font-size: 8pt;
	font-weight: normal;
	background-color: green;
	border-radius: 10px;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
}

/*** 一般広告素材 ***/
.table-standard.sozai-list th {
	text-align: left;
}
.table-standard.sozai-list tbody td {
	vertical-align: top;
}
.table-standard.sozai-list.w-150 tbody td:first-of-type {
	width: 170px;
}
.table-standard.sozai-list.w-300 tbody td:first-of-type {
	width: 50%;
}
.table-standard.sozai-list textarea {
	width:100%;
	font-size: 9pt;
	word-break: break-all;
}
.table-standard.sozai-list .banner.vertical {
	max-height: 300px;
	overflow-x: hidden;
	overflow-y: auto;
}
.table-standard.sozai-list .banner.landscape {
	max-width:608px;
	overflow-x: auto;
	overflow-y: hidden;
}
.table-standard.sozai-list .banner.landscape img {
	max-width: 100%;
}

/********************************************************
 *** テーブルへのスタイル適用
 ********************************************************/

.table-standard {
	width: 100%;
	border-right: solid 1px #666;
	border-top: solid 1px #666;
	border-spacing: 0;
	margin: 10px 0px;
	background-color: #FFF;
}
.table-standard thead {
	background-color: #EEE;
	background-color: rgba(0, 0, 0, 0.066);
}
.table-standard th, 
.table-standard td {
	border-left: solid 1px #666;
	border-bottom: solid 1px #666;
	padding: 5px;
}
.table-standard .ttitle {
	background-color: #EEE;
	background-color: rgba(0, 0, 0, 0.066);
	text-align: center;
}
.table-standard .left {
	background-color: #EEE;
	background-color: rgba(0, 0, 0, 0.066);
	width: 150px;
}
.table-standard .redbg {
	background-color: #FEE;
	background-color: rgba(255, 0, 0, 0.066);
}
.table-standard input[type="radio"] {
	margin: 2.5px;
	padding: 0;
	vertical-align: -2px;
}
.table-standard input[type="radio"] + label {
	line-height: 1.75;
}

/*** 売上レポート ***/
.contents .space.chart-wrapper {
	/*padding: 0 10px 0 0px;*/
}
.table-standard.salesreport thead th {
	padding: 6px 5px;
	line-height: 1;
	white-space: nowrap;
}
.table-standard.salesreport tbody td {
	line-height: 1.2;
}
.table-standard.salesreport td[bgcolor="#FFFFFF"] {
	background-color: transparent;
}
.table-standard.salesreport td[bgcolor="#F7F7F7"], 
.table-standard.salesreport td[bgcolor="#EEEEEE"] {
	background-color: rgba(0, 0, 0, 0.03);
}
.table-standard.salesreport td[bgcolor="#FFEEEE"] {
	background-color: rgba(255, 0, 0, 0.066);
}
.table-standard.salesreport tr[bgcolor="#FFFFFF"] {
	background-color: transparent;
}
.table-standard.salesreport tr[bgcolor="#F7F7F7"], 
.table-standard.salesreport tr[bgcolor="#EEEEEE"] {
	background-color: rgba(0, 0, 0, 0.03);
}
.table-standard.salesreport td.rank-count {
	width: 32px;
	text-align: center;
}
.salesreport-showall {
	text-align: right;
}

/********************************************************
 *** ログイン前
 ********************************************************/

#main-left .logout {
	filter: alpha(opacity=50);
	-moz-opacity: 0.50;
	opacity: 0.50;
}
#main-left .join {
	background: #0000CC;
	margin-bottom: 8px;
}
#main-left .login {
	background: #CC0000;
}
#main-left .link a {
	display: block;
	padding: 6px 8px;
	color: #FFF;
}
#main-left .link b {
	position: relative;
	font-size: 10pt;
}
#main-left .link b::after {
	position: absolute;
	top: 50%;
	right: -10px;
	margin-top: -3pt;
	width: 6px;
	height: 6px;
	content: "";
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
	transform: rotate(45deg);
}

/********************************************************
 *** ログイン前（代理店規約）
 ********************************************************/

.contents .rule .subtitle {
	margin: 15px 0px 5px 0px;
}
.contents .rule .space {
	margin-bottom: 5px;
}
.contents .rule > div:last-child {
	margin-bottom: 0px;
}

/********************************************************
 *** 景品表示法の指定告示に関して
 ********************************************************/

/*** メインビジュアル ***/
.fairlabeling {
	display: block;
	margin-bottom: 15px;
	background-color: #F9CE0B;
}
.fairlabeling::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 80%;
	margin: auto;
	content: "";
	width: 15%;
	height: 75%;
	background-color: #FFF;
	background-image: url(https://img.duga.jp/img/icon/svg/caution.svg);
	background-repeat: no-repeat;
	background-position: 50% 30%;
	background-size: 80%;
	border-radius: 100%;
}
.fairlabeling > * {
	position: absolute;
	top: 0;
	right: 2%;
	bottom: 25%;
	left: 20%;
	margin: auto;
	height: 1.5em;
	font-size: 9.2pt;
	font-weight: bold;
	text-align: center;
}
.fairlabeling h1 {
	top: 25%;
	bottom: 0;
	font-size: 17pt;
}
.fairlabeling h1 span {
	color: #F00;
}

/*** ○× ***/
.symbol::before {
	display: inline-block;
	margin-right: 0.2em;
	width: 1.4em;
	height: 1.4em;
	content: "";
	background-size: 100% 100%;
	background-repeat: no-repeat;
	vertical-align: -0.34em;
}
.symbol.maru::before {
	background-image: url(https://img.duga.jp/img/icon/svg/symbol-maru.svg);
}
.symbol.batu::before {
	background-image: url(https://img.duga.jp/img/icon/svg/symbol-batu.svg);
}

/*** 表示の例 ***/
.ad-example {
	position: relative;
	margin-bottom: 10px;
	background-image: url(https://duga.jp/aff/img/fairlabeling.png);
	background-size: 100%;
	background-repeat: no-repeat;
}
.ad-example::before {
	display: block;
	padding-top: 53.4%;
	content: "";
}
.ad-example .line {
	margin-bottom: 10%;
	padding-top: 10%;
	width: 100%;
	background-color: #aaa;
}
.ad-example .mobile {
	left: 2.1%;
	width: 26%;
}
.ad-example .mobile .line {
	margin-bottom: 6.16%;
	padding-top: 6.16%;
}
.ad-example .pc {
	left: 35%;
	width: 41%;
}
.ad-example .pc .line {
	margin-bottom: 3.9%;
	padding-top: 3.9%;
}
.ad-example .right {
	left: 79%;
	width: 16%;
}
.ad-example .text {
	position: absolute;
	top: 23.3%;
}
.ad-example .text::before {
	position: absolute;
	margin-top: -0.7em;
	padding: 0 0.3em;
	content: "アフィリエイト広告を利用しています";
	border: solid red 0.4em;
	font-size: 20pt;
	font-weight: bold;
	white-space: nowrap;
	transform: scale(0.36);
	transform-origin: left;
}
.ad-example .header {
	position: absolute;
	top: 18%;
	height: 6%;
}
.ad-example .header::before {
	position: absolute;
	margin-top: -0.5em;
	content: "DUGAのレビューサイト";
	color: #00b200;
	font-size: 30pt;
	font-weight: bold;
	white-space: nowrap;
	transform: scale(0.36);
	transform-origin: left;
}
.ad-example .main-visual {
	position: absolute;
	top: 31%;
	height: 28%;
	background-color: #00b200;
}
.ad-example .main-visual .round {
	position: absolute;
	margin: 5%;
	padding-top: 20%;
	width: 20%;
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 100%;
}
.ad-example .main-visual .line {
	margin-right: 6%;
	margin-left: 32%;
	width: 62%;
	background-color: rgba(255, 255, 255, 0.5);
}
.ad-example .main-visual .line:nth-child(2) {
	margin-top: 6%;
}
.ad-example .right.main-visual {
	background-color: #ffbf00;
}
.ad-example .footer {
	position: absolute;
	top: 63%;
	height: 9%;
}
.ad-example .footer .square {
	position: absolute;
	padding-top: 30%;
	width: 30%;
	background: #e5e5e5;
	border-right: 1vw solid #FFF;
}
.ad-example .ad {
	position: absolute;
	top: 75%;
	height: 21%;
}
.ad-example .ad .line {
	background-color: #666;
}
.ad-example .ad .square {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 43%;
	background: #bfe2bf;
	border-left: 1vw solid #FFF;
}
.ad-example .pc.ad .square {
	width: 38%;
}
.ad-example.desirable-2 .text {
	top: 67.2%;
}
.ad-example.desirable-2 .text::before {
	content: "広告";
}
.ad-example.desirable-2 .main-visual {
	top: 26%;
}
.ad-example.desirable-2 .footer {
	top: 57%;
}
.ad-example.undesirable-1 .text {
	top: 91.6%;
}
.ad-example.undesirable-1 .text::before {
	right: 0;
	content: "広告";
	transform-origin: right;
}
.ad-example.undesirable-1 .main-visual {
	top: 26%;
}
.ad-example.undesirable-1 .footer {
	top: 57%;
}
.ad-example.undesirable-1 .ad {
	top: 69%;
}
.ad-example.undesirable-2 .mobile.text::before {
	margin-top: -1.4em;
	padding: 0.3em 0.6em;
	border-width: 0.8em;
	transform: scale(0.16);
}
.ad-example.undesirable-2 .pc.text::before {
	color: #bbb;
}
.ad-example.undesirable-3 .mobile.text::before {
	content: "#○○ #○○ #PR #○○ #○○";
}
.ad-example.undesirable-3 .pc.text::before {
	content: "広告 ※これは個人の感想です。";
}
