.ptec .clearfix::after,
.ptec article::after,
.ptec aside::after,
.ptec div::after,
.ptec footer::after,
.ptec form::after,
.ptec h1::after,
.ptec h2::after,
.ptec h3::after,
.ptec h4::after,
.ptec header::after,
.ptec input::after,
.ptec li::after,
.ptec main::after,
.ptec nav::after,
.ptec ol::after,
.ptec p::after,
.ptec section::after,
.ptec ul::after,
.ptec::after,
p:empty {
	display: none
}

.ptec a {
	-webkit-transition: .3s all;
	transition: .3s all
}

#custom {
	max-width: none !important;
	background-color: #000
}

#custom .mv {
	position: relative;
	padding-top: 50px;
	background-image: url(/cms/wp-content/item_body/2019_iPhone_PTEC/mv_back.png);
}


#custom .mv .inner.catch_bg_full_gloss_GN10P { background: url(/cms/wp-content/item_body/2019_androidaw_PTEC/catch_bg_gloss_GN10P.png) center bottom no-repeat }


#custom .mv h2 {
	position: absolute;
	top: 1em;
	left: 1em;
	width: 10%
}

#custom .mv .catch {
	width: 50%;
	margin: 0 auto;
	text-align: center;
	overflow: hidden
}

#custom .mv .catch .multiply {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center
}

#custom .mv .catch .multiply span {
	color: #fff;
	font-size: 80px;
	line-height: 1
}

#custom .mv ol {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
	width: 26%;
	padding: 50px 0;
	margin: 0 auto;
	color: #fff;
	font-size: 1.3em;
	font-family: 'Noto Serif JP', sans-serif;
	text-shadow: -1px 1px 4px rgba(0, 0, 0, .8);
	white-space: nowrap
}

#custom .mv ol li {
	letter-spacing: .2em;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl
}

#custom .contents {
	color: #fff
}

#custom .lineup + .contents {
	margin-top: 60px
}

#custom .contents,
#custom .contents .item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
  margin-top: 40px;
}

#custom .contents .item {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	width: 38%;
	margin: 0 3% 0 4%
}

#custom .contents .item .pkg {
	width: 100%
}

#custom .contents .item .range {
	width: 40%
}

#custom .contents .item > p {
	width: 100%;
	padding: 1em;
	margin-top: 20px;
	color: #fff;
	font-size: .8em;
	background-color: red;
	border-radius: 10px
}

#custom .contents .feature {
	width: 50%;
	margin-right: 5%
}

#custom .contents .feature > div {
	border-top: solid 1px #fffa80;
	border-bottom: solid 1px #fffa80;
	margin: 2% 0 6%
}

#custom .contents .feature > div h3 {
	margin-top: -5%;
	padding: 2%;
	background-color: #000;
	width: 30%
}

#custom .contents .feature > div h3 img {
	width: 60%
}

#custom .contents .feature > div p {
	padding: 2%
}

#custom .contents .feature > div p small {
	display: block
}

#custom .contents .feature > div p small::before {
	content: "※ "
}

#custom .contents .feature ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between
}

#custom .contents .feature ul li {
	width: 23%
}

#custom .contents .feature ul li div {
	border: 2px solid #fff;
	border-radius: 10px
}

#custom .contents .feature ul li div img {
	border-radius: 10px
}

#custom .contents .feature ul li p {
	margin-top: .4em;
	font-size: .9em;
	text-align: center
}

#revolution {
	margin-top: 50px;
	color: #fff
}

#revolution .revolution_1,
#revolution .revolution_2,
#revolution .revolution_3 {
	border-top: solid 1px #fff
}

#revolution .revolution_1 section h3,
#revolution .revolution_2 section h3,
#revolution .revolution_3 section h3 {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	height: 0;
	padding-bottom: 12%;
	background-size: contain;
	position: relative;
	margin-bottom: 0
}

#revolution .revolution_1 section h3 {
	background-image: url(../../item_body/2019_iPhone_PTEC/revolution_1_head.png)
}

#revolution .revolution_2 section h3 {
	background-image: url(../../item_body/2019_iPhone_PTEC/revolution_2_head.png)
}

#revolution .revolution_3 section h3 {
	background-image: url(../../item_body/2019_iPhone_PTEC/revolution_3_head.png)
}

#revolution .revolution_1 section h3 span,
#revolution .revolution_2 section h3 span,
#revolution .revolution_3 section h3 span {
	font-family: FontAwesome;
	text-indent: 0;
	line-height: 1.8em;
	font-size: 400%;
	position: absolute;
	left: 92%;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	cursor: pointer;
	-webkit-transition: all .3s;
	transition: all .3s
}

#revolution .revolution_1 div p {
	width: 70%;
	margin: 6% auto 4%;
	text-align: center;
	line-height: 1.6em
}

#revolution .revolution_1 div > div {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 94%;
	margin: 0 auto 6%
}

#revolution .revolution_1 div > div section {
	border: 1px solid #fff;
	width: 32%;
	position: relative
}

#revolution .revolution_1 div > div section:nth-child(2)::before {
	content: url(../../item_body/2019_iPhone_PTEC/r1_pointer01.png);
	position: absolute;
	top: 10%;
	left: -20%
}

#revolution .revolution_1 div > div section:last-child::before {
	content: url(../../item_body/2019_iPhone_PTEC/r1_pointer02.png);
	position: absolute;
	top: 10%;
	left: -20%
}

#revolution .revolution_1 div > div section:not(:first-child) {
	margin-left: 2%
}

#revolution .revolution_1 div > div section h4 {
	border-bottom: solid 1px #fff;
	background-color: hsla(0, 0%, 100%, .4);
	padding: .4em;
	font-size: 120%;
	text-align: center
}

#revolution .revolution_1 div > div section:nth-child(2) h4 {
	background-color: hsla(0, 0%, 100%, .2)
}

#revolution .revolution_1 div > div section .img_box img {
	width: 90%;
	display: block;
	height: auto;
	margin: 4% auto
}

#revolution .revolution_2 > div ul {
	width: 90%;
	margin: 8% auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex
}

#revolution .revolution_2 > div ul li {
	width: 32%;
	height: 18%
}

#revolution .revolution_2 > div ul li:not(:first-child) {
	margin-left: 3%
}

#revolution .revolution_2 > div ul li:first-child div table {
	height: 17%;
	border: 1px solid #fff;
	width: 100%
}

#revolution .revolution_2 > div ul li:first-child div table td,
#revolution .revolution_2 > div ul li:first-child div table th {
	border: 1px solid #fff;
	text-align: center;
	width: 50%
}

#revolution .revolution_2 > div ul li:first-child div table th {
	font-size: 112%;
	background-color: hsla(0, 0%, 100%, .4);
	padding: 7% 0
}

#revolution .revolution_2 > div ul li:first-child div table td {
	font-size: 180%;
	font-weight: 900;
	padding: 13% 0
}

#revolution .revolution_2 > div ul li h4 {
	font-size: 140%;
	border-bottom: 1px solid #fff;
	padding: .6em 0 .3em;
	margin-bottom: .4em
}

#revolution .revolution_3 > div p {
	width: 70%;
	text-align: center;
	margin: 4% auto
}

#revolution .revolution_3 > div h4 {
	width: 85%;
	margin: 20px auto 0;
	font-size: 140%
}

#revolution .revolution_3 > div h4 span {
	font-size: 80%
}

#revolution .revolution_3 > div .img_box {
	width: 85%;
	margin: 10px auto
}

#custom .lineup {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 30px 3%;
	margin-top: 30px;
	color: #fff;
	border-top: solid 1px #fffa80;
	border-bottom: solid 1px #fffa80
}

#custom .mv + .lineup {
	padding: 0;
	border: none
}

#custom .lineup h3 {
	width: 100%;
	text-align: center
}

#custom .lineup h3 img {
	width: 26%
}

#custom .lineup h3 span {
	display: block;
	margin-top: .4em;
	font-size: 1.4em
}

#custom .lineup section {
	width: 30%;
	margin-top: 30px;
	text-align: center
}

#custom .lineup section h4 {
	font-size: 1.2em
}

#custom .lineup section ul,
#custom .lineup section ul li + li {
	margin-top: 1em
}

#custom .lineup section ul li a {
	display: block;
	padding: 1em;
	color: #333;
	background-color: #fff;
	border: 1px solid #fffa80;
	border-radius: 6px
}

#custom .lineup section ul li a:hover {
	color: #fff;
	background-color: #666
}

.attention {
	padding-bottom: 1%;
	margin-top: 40px !important;
	color: #fff;
	text-align: center;
	background-color: #000
}

@media screen and (max-width:768px) {
	#custom .mv .catch {
		width: auto
	}

	#custom .mv .catch > img {
		max-width: 180px
	}

	#custom .mv .catch .multiply span {
		padding: .4em;
		font-size: 2em
	}

	#custom .mv ol {
		width: auto;
		padding: 30px 8%
	}
}

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

	#custom .contents .feature > p br,
	#custom .mv h2:after {
		display: none
	}

	#item_detail_wrapper .item_detail {
		width: 100%
	}

	#custom .mv h2 {
		width: 20%
	}

	#custom .mv .img_box:nth-child(2) {
		width: 30%
	}

	#custom .mv ol li:not(:last-child) {
		margin-left: 2em
	}

	#custom .contents .item {
		width: 70%;
		margin: 0 auto
	}

	#custom .contents .feature {
		width: 90%;
		margin: 5% auto
	}

	#custom .contents .feature > div h3 {
		width: 100%;
		margin: 2%
	}

	#custom .contents .feature > div h3 img {
		max-width: 25%
	}

	#custom .contents .feature > div p {
		padding: 2% 2% 4%
	}

	#custom .contents .feature > p {
		margin: 5% auto;
		width: 90%;
		text-align: center
	}

	#revolution .revolution_1 section h3,
	#revolution .revolution_2 section h3,
	#revolution .revolution_3 section h3 {
		padding-bottom: 16%
	}

	#revolution .revolution_1 section h3 {
		background-image: url(../../item_body/2019_iPhone_PTEC/revolution_1_head_sp.png)
	}

	#revolution .revolution_2 section h3 {
		background-image: url(../../item_body/2019_iPhone_PTEC/revolution_2_head_sp.png)
	}

	#revolution .revolution_3 section h3 {
		background-image: url(../../item_body/2019_iPhone_PTEC/revolution_3_head_sp.png)
	}

	#revolution .revolution_1 div p {
		width: 90%;
		margin: 8% auto
	}

	#revolution .revolution_1 div > div {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		margin: 0 auto 15%
	}

	#revolution .revolution_1 div > div section:not(:first-child),
	#revolution .revolution_2 > div ul li:not(:first-child) {
		margin-left: 0;
		margin-top: 6%
	}

	#revolution .revolution_1 div > div section {
		width: 100%
	}

	#revolution .revolution_1 div > div section:nth-child(2)::before {
		content: url(../../item_body/2019_iPhone_PTEC/r1_pointer01_sp.png);
		top: -16%;
		left: 1%
	}

	#revolution .revolution_1 div > div section:last-child::before {
		content: url(../../item_body/2019_iPhone_PTEC/r1_pointer02_sp.png);
		top: -18%;
		left: 1%
	}

	#revolution .revolution_1 div > div section:last-of-type {
		margin-bottom: 8%
	}

	#revolution .revolution_2 > div ul {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		padding-bottom: 8%
	}

	#revolution .revolution_2 > div ul li {
		width: 100%;
		margin-bottom: 8%
	}

	#revolution .revolution_2 > div ul li:first-child div table th {
		padding: 3% 0
	}

	#revolution .revolution_2 > div ul li:first-child div table td {
		padding: 6% 0
	}

	#revolution .revolution_3 > div p {
		width: 90%;
		margin: 8% auto
	}

	#custom .lineup h3,
	#revolution .revolution_3 > div .img_box {
		width: 100%
	}

	#custom .lineup {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		padding: 8% 3%
	}

	#custom .lineup h3 img {
		display: block;
		width: 60%;
		margin: 0 auto
	}

	#custom .lineup h3 span {
		font-size: 160% !important;
		margin: 3% auto
	}

	#custom .lineup section {
		width: 100%
	}
}