@charset "UTF-8";
/* CSS Document */

	#kv {
		height: 140px;
		background: url(/common/img/kv-service.jpg) left -50px no-repeat;
		background-size: 100% auto;
		position: relative;
		margin: 0 0 10px;
	}
	#kv h2 {
		display: inline-block;
		width:90%;
		background: rgba(255,255,255,0.7);
		font-size: 24px;
		font-size: 2.4rem;
		font-weight: bold;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		padding: 0 1em;
		text-align: center;
	}
	

/* service */
	.service #mineral {
		background: url(/common/img/service/bg-mineral.jpg) right 10px no-repeat;
		background-size: 100% auto;
	}
	.service #mineral h2 {
		background: #2B556E;
		padding: 5px 15px;
		font-size: 18px;
		font-size: 1.8rem;
		text-align: center;
		color: #fff;
		line-height: 1.5;
		-ms-filter: "alpha( opacity=80 )";
		filter: alpha( opacity=80 );
		opacity: 0.8;
	}
	.service #mineral ol {
		margin: 0 0 15px;
		padding: 15px 10px;
		border: 1px solid #5cb9ed;
	}
	.service #mineral ol li {
		color: #2B556E;
		font-weight: bold;
		text-indent: -1em;
		padding: 0 0 0 1em;
	}
	.service #mineral strong {
		color: #F0767A;
	}
	.service #mineral .tourmaline h3 {
		background: #F0767A;
		padding: 5px 15px;
		font-size: 18px;
		font-size: 1.8rem;
		text-align: center;
		color: #fff;
	}
	.service #mineral .tourmaline ul {
		border: 1px solid #F0767A;
		margin: 0 0 15px;
		padding: 30px 15px;
		background: url(/common/img/service/bg-effect.jpg) 94% center no-repeat;
		background-size:auto 100px;
	}
	.service #mineral .tourmaline li {
		color: #F0767A;
		font-weight: bold;
	}
	.service #baby {
		margin: -56px 0 0 0;
		padding: 56px 3% 0 3%;
	}
	.service .baby {
		width: 100%;
		background: url(/common/img/service/bg-bagy.gif) right bottom no-repeat;
		background-size: contain;

	}
	.service .baby li {
		width: 49%;
		float: left;
		text-align: center;
		background: #F0767A;
		color: #fff;
		border-radius: 6px;
		font-weight: bold;
		font-size: 16px;
		font-size: 1.6rem;
		margin: 0 1% 1% 0;
		padding: 4px 0;
		line-height: 1.5;
		-ms-filter: "alpha( opacity=80 )";
		filter: alpha( opacity=80 );
		opacity: 0.8;
	}
	.service .baby li:nth-child(2n) {
		float: right;
		margin: 0 0 1% 1%;
	}
	.service .baby li span {
		color: #fff;
	}
	.service .baby .option {
		text-align: right;
	}
	.service #fold {
		margin: -56px 0 0 0;
		padding: 56px 3% 0 3%;
	}


	/* flow */
	.flow p {
		margin: 0 auto 40px;
		max-width: 590px;
	}
	.flow p img {
		max-width: 100%;
		height: auto;
	}

	/* question */
	.question h3,
	.question p {
		text-indent: -1em;
		padding: 0 0 0 1em;
	}
	.question .q {
		background: #5cb9ed;
		padding: 10px 15px;
	}
	.question h3 {
		color: #fff;
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.3;
	}
	.question .q span {
		color: #fff;
		padding: 0 6px 0 0;
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: bold;
	}
	.question .a {
		padding: 15px 15px 30px;
	}
	.question p span {
		color: #F0767A;
		padding: 0 6px 0 0;
		font-size: 14px;
		font-size: 1.4rem;
		font-weight: bold;
	}
	.question p {
		font-size: 14px;
		font-size: 1.4rem;
	}
	.question p strong {
		color: #2B556E;
	}

	/* shop */
	#shop .map {
		padding: 15px 0 0 0;
	}
	#shop .map iframe {
		width: 100%;
	}
 
	/* compensation */
	.compensation p {
		margin: 0 0 20px;
		border-bottom: 1px dashed #ddd;
		padding: 0 0 20px;
	}
	.compensation ul {
		padding: 15px 0;
	}
	.compensation ul li {
		line-height: 1.5;
		margin: 0 1em 1em;
	}

	/* policy */
	.policy dt {
		font-weight: bold;
	}
	.policy dd {
		margin: 0 0 1em;
	}

	/* recruit */
	.recruit table {
		width: 100%;
		border-right: 1px solid #5cb9ed;
		border-left: 1px solid #5cb9ed;
		border-bottom: 1px solid #5cb9ed;
		box-sizing: border-box;
	}
	.recruit tr,
	.recruit th,
	.recruit td {
		width: 100%;
		display: block;
		text-align: center;
	}
	.recruit th {
		background: #5cb9ed;
		color: #fff;
		font-size: 16px;
		font-size: 1.6rem;
	}
	.recruit td {
		padding: 15px 0 30px;
	}

	/* inquiry */
	.inquiry dt {
		background: #5cb9ed;
		color: #fff;
		font-size: 16px;
		font-size: 1.6rem;
		text-align: center;
	}
	.inquiry dd {
		text-align: center;
		padding: 15px 0 30px;
		font-size: 16px;
		font-size: 1.6rem;
	}
	.inquiry dd a {
		font-size: 20px;
		font-size: 2.0rem;
	}

	.inquiry form table {
		width: 100%;
	}
	.inquiry form tr,
	.inquiry form th,
	.inquiry form td {
		width: 100%;
		display: block;
	}
	.inquiry form th {
		background: #eee;
		font-size: 16px;
		font-size: 1.6rem;

	}
	.inquiry form td {
		padding: 15px 15px 30px;
	}
	.inquiry form input,
	.inquiry form textarea,
	.inquiry form select {
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
	}
	.inquiry button[type="submit"] {
		background: #5cb9ed;
		color: #fff;
		display: block;
		width: 100%;
		border: none;
		margin: 30px 0;
		padding: 15px 0;
		font-size: 18px;
		font-size: 1.8rem;
		border-radius: 6px;
	}
	.inquiry button[type="submit"] i {
		display: inline-block;
		margin: 0 0 0 10px;
		color: #fff;
		font-size: 18px;
		font-size: 1.8rem;
	}
	.inquiry .back {
		padding: 15px 0 0 0;
	}
	.inquiry .back a {
		display: block;
		background: #888;
		color: #fff;
		display: block;
		width: 80%;
		border: none;
		margin: 0 auto;
		padding: 12px 0;
		font-size: 14px;
		font-size: 1.4rem;
		text-align: center;
		text-decoration: none;
		border-radius: 6px;
	}
	.inquiry .back i {
		color: #fff;
		font-size: 14px;
		font-size: 1.4rem;
		display: inline-block;
		margin: 0 10px 0 0;
	}
	.inquiry .error_messe {
		color: #c00;
		margin: 0 0 1em;
	}
	.inquiry .chkComment {
		margin: 0 0 20px;
		line-height: 1.5;
	}
	.inquiry .thanks {
		text-align: center;
	}
	.inquiry .red {
		color: #c00;
	}


@media screen and (min-width: 813px) {
	.service #mineral .mineralList {
		float: left;
		width: 64%;
	}
	.service #mineral .mineralList ol {
		height: 210px;
		background: rgba(255,255,255,0.7);
	}
	.service #mineral .tourmaline {
		float: right;
		width: 30%;
	}
	.service #mineral .tourmaline ul {
		height: 210px;
		background: rgba(255,255,255,1) url(/common/img/service/bg-effect.jpg) 94% center no-repeat;
		background-size: 50% auto;
	}
	.service #mineral .tourmaline li {
		margin: 0 0 2em;
	}
}