@charset "utf-8";

.page-service {
	background-image: url(page_service.jpg);
}

.page-agreement {
	background-image: url(agreement_vi.jpg);
}

.page-postermaking {
	background-image: url(postermaking_vi.jpg);
}

.page-websitecreation {
	background-image: url(websitecreation_vi.jpg);
}

.ch_page-postermaking {
	background-image: url(ch_postermaking_vi.jpg);
}

.page-amazon-image {
	background-image: url(amazon-image_vi.jpg);
}


.p-box {
	width: 100%;
	margin: 0 0 40px 0;
	text-align: left;
}

ol.ol-box {
	width: 100%;
	margin: 0 0 80px 0;
}

ol.ol-box li {
	line-height: 1.6;
	border-bottom: dashed 1px #ccc;
}


ol.ol-box li div.pht {
	display: block;
	width: 100%;
	padding: 20px 0 10px 0;
	text-align: left;
}

ol.ol-box li div.pht img {
	width: 100%;
}


ol.ol-box li div.txt {
	padding: 0px 0 20px 0;
	display: block;
	width: 100%;
}

ol.ol-box li div.txt h4 {
	font-size: 1.2rem;
	margin-bottom: 10px;
}

ol.ol-box li div.txt p {
	font-size: 1.0rem;
}

ol.ol-box li div.txt span {
	font-size: 0.8rem;
	display: inline-block;
	padding: 10px;
	margin: 0 5px 10px 0;
	background: #747474;
	color: #fff;
	text-align: center;
	border-radius: 10px;
}

ol.ol-box li div.txt a {
	font-size: 1.2rem;
	padding: 12px 6px;
}


.service-box,
.service-box2,
.service-cel2,
.service-cel3 {
	width: 100%;
	margin: 0 0 40px 0;
}

.service-box div.pht,
.service-box2 div.pht {
	display: block;
	width: 100%;
	padding: 20px 0 10px 0;
	text-align: left;
}

.service-box div.pht img,
.service-box2 div.pht img {
	width: 100%;
}

.service-cel2 div,
.service-cel3 div {
	width: 100%;
	display: block;
	padding: 0 0 10px 0;
}

.service-cel2 div img,
.service-cel3 div img {
	width: 100%;
}

.service-box div.txt,
.service-box2 div.txt {
	padding: 0px 0 10px 0;
	display: block;
	width: 100%;
	text-align: left;
}

.service-box div.txt .emp,
.service-box2 div.txt .emp {
	font-size: 1.2rem;
	line-height: 1.4;
	font-weight: 700;
}

.service-img {
	width: 100%;
	text-align: center;
	display: block;
}

.service-img img {
	width: 100%;
}

.b_red {
	color: #e60000;
	font-size: 1.6rem;
	line-height: 1.8;
	font-weight: 700;
}

.ellipse {
	display: inline-block;
	padding: 20px;
	margin: 0 5px 20px 0;
	background: #00a0e8;
	color: #fff;
	text-align: center;
	border-radius: 10px;
}


@media screen and (min-width: 780px) {
/* pc */

.p-box {
	text-align: center;
}

ol.ol-box {
	width: 100%;
	margin: 0 0 80px 0;
}


ol.ol-box li div.pht,
ol.ol-box li div.txt {
	line-height: 1.6;
	display: table-cell;
}

ol.ol-box li div.pht {
	width: 50%;
	padding: 20px 0 20px 0;
	font-weight: 700;
	text-align: left;
}

ol.ol-box li div.txt {
	padding: 20px 0 20px 20px;
	width: 50%;
	font-size: 1.6rem;
	vertical-align:top;
}


.service-box div.pht,
.service-box div.txt,
.service-box2 div.pht,
.service-box2 div.txt {
	display: table-cell;
}

.service-box div.pht,
.service-box2 div.pht {
	width: 40%;
	padding: 20px 0 20px 0;
	text-align: left;
}

.service-box div.txt,
.service-box2 div.txt {
	padding: 20px 0 20px 20px;
	width: 60%;
	vertical-align:top;
}

.service-box div.txt h3,
.service-box2 div.txt h3 {
	text-align: left;
}

.service-box div.txt p,
.service-box2 div.txt p {
	padding: 0px 35px 5px 0px;
	font-size: 1.0rem;
}

.service-box2 {
  display: flex;
}

.service-box2 .pht {
	order: 1;
}

.service-cel2 div {
	width: 50%;
	padding: 0 20px 20px 0;
	display: table-cell;
}

.service-cel3 div {
	width: 30%;
	padding: 0 20px 20px 0;
	display: table-cell;
}

.service-cel2 div img,
.service-cel3 div img {
	width: 100%;
}



/* /pc */
}