@charset "utf-8";

/*=================================

越境EC

=================================*/

.crossBorderEc .mainimg {
	width: 100%;
	background: linear-gradient(to bottom, rgba(93,194,238,1) 0%,rgba(100,187,197,1) 50%,rgba(2,95,191,1) 100%);
}

.crossBorderEc .mainimg img {
	display: block;
	max-width: 100%;
	margin: 0 auto;
}

.crossBorderEc .inner {
	padding: 24px 0;
	background: #E8E8E8;
	overflow: hidden;
}
.crossBorderEc .inner img {
	margin-bottom: 0;
}

.crossBorderEc .inner .clm3,
.crossBorderEc .inner .clm4 {
	background-color: #E8E8E8;
	width: 880px;
	margin: 0 auto;
}

.crossBorderEc .inner .clm3 .colOne,
.crossBorderEc .inner .clm3 .colTwo,
.crossBorderEc .inner .clm3 .colThree {
	background: #e8e8e8;
	padding: 12px;
}
.crossBorderEc .inner .clm4 .colOne,
.crossBorderEc .inner .clm4 .colTwo,
.crossBorderEc .inner .clm4 .colThree,
.crossBorderEc .inner .clm4 .colFour {
	background-color: #FFF;
	padding: 12px;
}

.crossBorderEc .inner .clm3 > div img {
	margin-bottom: 12px;
}

.crossBorderEc .inner .clm4 dt {
	margin-bottom: 8px;
	font-weight: bold;
}

.crossBorderEc .textBox img {
	margin: -28px auto 0;
}


/*お問い合わせエリア*/
.contactBox.clm2 {
	width: 880px;
	margin: 0 auto;
	padding: 24px;
}

.contactBox .tel {
	background: #4AB7CD url(/img/global/cross-border-ec/index_bg01.png) no-repeat left top;
	background-size: contain;
	height: 70px;
	margin: 0;
}
.contactBox .tel span {
	padding: 10px 0 0 130px;
	display: inline-block;
	color: #FFF;
	font-size: 30px;
}
.contactBox .mail {
	background: url(/img/global/cross-border-ec/index_bg02.png) no-repeat left top;
	background-size: contain;
	height: 74px;
	margin: 0;
}
.contactBox .mail a {
	padding: 15px 0 20px 100px;
	display: block;
	color: #FFF;
	font-size: 24px;
}


@media screen and (max-width: 899px) {
	.contactBox.clm2 {
		width: 100%;
	}
	.crossBorderEc .inner .clm3,
	.crossBorderEc .inner .clm4 {
		width: 100%;
	}
	.crossBorderEc .inner .clm4 {
		background: #e8e8e8;
	}
	.crossBorderEc .inner .clm3 > div {
		margin: 16px 12px 8px;
	}
	.crossBorderEc .inner .clm4 > div {
		margin: 32px 12px 8px;
	}
	.textBox {
		width: 100%;
	}
	.contactBox .tel,
	.contactBox .mail {
		max-width: 355px;
		height: auto;
		margin: 16px auto 0;
	}
	.contactBox .tel span {
		padding: 10px 0 0 100px;
		font-size: 24px;
	}
	.contactBox .mail a {
		padding: 15px 0 20px 60px;
		font-size: 18px;
	}
	/* overRide */
	.clmDesign7 > * {
		width: calc(100% / 2 - 24px) !important;
	}
}


@media screen and (max-width: 599px) {
	.crossBorderEc .inner .clm3 > div img {
		max-width: 160px;
	}
	.contactBox .mail a {
		padding: 15px 0 20px 90px;
	}
}