@charset "utf-8";
/* ----------------------------------------
   ドスパラについて CSS
---------------------------------------- */
@font-face {
	font-family: "webfont";
	src: url(/5shopping/templates/share/contents/font/genei_gothic.woff) format('woff2');
}

@font-face {
	font-family: "webfont2";
	src: url(/5shopping/templates/share/contents/font/genei_gothic2.woff) format('woff2');
}

/* レイアウトのリセット
---------------------------------------- */
#sub, .linkArea { display: none; }

#container, .column2R #main {
	float: none;
	width: 100%;
}

.breadCrumb, .pagetop {
	width: 970px;
  margin-left: auto;
  margin-right: auto;
}
#container {
    padding-top: 15px;
}
/* レイアウト
---------------------------------------- */
.spOnly { display: none; }
.pcOnly { display: block; }
.pcOnly.inlineBlock { display: inline-block; }
.pcOnly.inline { display: inline; }

#aboutDospara {
	line-height: 1.8;
	color: #333;
	font-size: 14px;
}

#aboutDospara .tblSet {
	display: table;
	width: 100%;
	margin: auto;
}

#aboutDospara .tblSet .cell {
	display: table-cell;
	vertical-align: top;
}

#aboutDospara .tblSet .cell.mid { vertical-align: middle; }
#aboutDospara .tblSet .cell.btm { vertical-align: bottom; }

#aboutDospara { text-align: center; }

#aboutDospara * { box-sizing: border-box; }

#hero {
	padding: 60px 0;
	background: #00b3e6;
}

#hero h1 img { margin: auto; }

#mainContents {
	width: 100%;
	max-width: 970px;
	margin: 0 auto;
	padding: 0 20px;
}

#mainContents > section {
	padding: 50px 0;
	border-bottom: 2px solid #b4cae3;
}

#aboutDospara h2 {
	margin: 0 0 30px;
	line-height: 1.1;
	color: #0550a3;
	font-family: webfont, Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-size: 40px;
	font-weight: bold;
}

#mainContents .linkTxt { margin-top: 1em; }

#mainContents .linkTxt a {
	text-decoration: none;
	color: #29abe2;
	font-size: 12px;
}

#mainContents .linkTxt a::after {
	content: '>>';
	margin-left: 5px;
}

#mainContents .linkTxt a:hover { text-decoration: underline; }

/* #history
---------------------------------------- */
#history {}

#history .tblSet {
	max-width: 670px;
	margin: auto;
}

#history .tblSet img { border: 1px solid #ccc; }

#history .tblSet .cell:last-child {
	padding-left: 15px;
	text-align: left;
}

#history .linkTxt { text-align: right; }


/* #cashless
---------------------------------------- */
#cashless .cashlessBox {
	width: 72%;
    margin: 0 auto;
}
#cashless h2 span {
	font-family: "M PLUS 1p", sans-serif;
	font-weight: 900;
	font-size: 42px;
}
#cashless h2 span.lp {
	letter-spacing: -6px;
}
#cashless img {
	max-width: 100%;
	border: 1px solid #ccc;
}
#cashless .txtLeft {
	text-align: left;
	margin-top: 1em;
}
#cashless .linkTxt {
	text-align: right;
}

/* #fivePoints
---------------------------------------- */
#fivePoints {}

#fivePoints .tblSet {
	width: auto;
	margin-top: 30px;
}

#fivePoints .set1 { margin-top: 0; }
/*#fivePoints .set1 .cell { width: 250px; }
#fivePoints .set1 .cell:nth-child(2) { width: 310px; }

#fivePoints .set2 .cell { width: 265px; }
#fivePoints .set2 .cell:first-child { padding-right: 15px; }
#fivePoints .set2 .cell:last-child  { padding-left: 15px; }*/

#fivePoints .set1 { margin-top: 0; }
#fivePoints .set1, #fivePoints .set2 {
	display: flex;
	width: 1060px;
    margin-left: -65px;
}
#fivePoints .set1 .cell, #fivePoints .set2 .cell {
	width: 245px;
	margin: 0 10px;
}

#fivePoints .tblSet p {
	width: 100%;
	max-width: 250px;
	margin: 1em auto 0;
	text-align: left;
	line-height: 1.5;
	font-size: 13px;
}

#fivePoints .tblSet .lead {
	line-height: 1.3;
	text-align: center;
	color: #4d4d4d;
	font-size: 17px;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-weight: bold;
}

/* #products
---------------------------------------- */
#products {}

#products .tblSet {
	width: 750px;
	margin-top: 20px;
}

#products h2 + .tblSet { margin-top: 0; }

/*#products .tblSet .cell { width: 50%; }*/

#products .tblSet .cell:first-child { padding-right: 16px; }
#products .tblSet .cell:last-child { padding-left: 16px; }

#products .tblSet .cell a {
	display: block;
	position: relative;
	height: 200px;
	padding: 15px 0 0;
	border: 1px solid #3974b6;
	text-align: center;
}

#products .tblSet .cell a:hover {}

#products .tblSet .cell a::after {
	content: '';
	position: absolute;
	right: 5px;
	bottom: 5px;
	width: 19px;
	height: 19px;
	background: url(/5shopping/templates/share/contents/img/about-dospara/icon_new_arrow_01.png) no-repeat left top;
	background-size: 100% auto;
}

#products .tblSet .cell a,
#products .tblSet .cell a * { text-decoration: none; }

#products .tblSet .cell a h3 {
	margin-bottom: 20px;
	line-height: 1.1;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-size: 17px;
	font-weight: bold;
}

#products .tblSet .cell.goods a h3 { margin-bottom: 10px; }

#products .tblSet .cell a img {
	border: 1px solid #ccc;
}

#products .tblSet .cell a p {
	margin-top: 10px;
	font-size: 12px;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-weight: bold;
}

#products .tblSet .cell a:hover {
	background: #0550a3;
	color: #fff;
}

#products .tblSet .cell a:hover::after { background-image: url(/5shopping/templates/share/contents/img/about-dospara/icon_new_arrow_01b.png); }


/* #service
---------------------------------------- */
#service {}

#service .tblSet {
	width: auto;
	margin-top: 45px;
}

#service .set1 { margin-top: 0; }

#service .tblSet .cell,
#service .set1 .cell:nth-child(2) { width: 250px; }

#service .tblSet .cell .inner {
	width: 190px;
	margin: 0 auto;
}

#service .tblSet .cell .inner h3 {
	display: table;
	width: 100%;
	height: 90px;
	border: 1px solid #ccc;
}

#service .tblSet .cell .inner h3 span {
	display: table-cell;
	vertical-align: middle;
}

#service .tblSet .cell .inner p {
	margin-top: 1em;
	text-align: left;
	line-height: 1.5;
	font-size: 13px;
}

/* #payment
---------------------------------------- */
#payment { border: none!important; }

#payment .box {
	width: 540px;
	padding: 10px;
	margin: auto;
	border: 1px solid #135aa8;
	border-radius: 10px;
}

#payment .box h2 {
	margin-bottom: 20px;
	font-size: 34px;
}

#payment .box h3 {
	line-height: 1.1;
	color: #4d4d4d;
	font-size: 17px;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-weight: bold;
}

#payment .tblSet {
	max-width: 480px;
	margin-top: 10px;
}

#payment .tblSet .cell { width: 50%; }

#payment .tblSet li {
	padding-left: 1.3em;
	text-indent: -1.3em;
	text-align: left;
	font-size: 13px;
}

#payment .tblSet li::before {
	content: '・';
	margin-right: 5px;
}

#payment .detailBtn { margin-top: 10px; }

#payment .detailBtn a {
	display: inline-block;
	width: auto;
	padding: 6px 11px 4px;
	background: #0550a3;
	border: 2px solid #0550a3;
	line-height: 1.1;
	text-decoration: none;
	color: #fff;
	font-size: 17px;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-weight: bold;
}

#payment .detailBtn a:hover {
	background: #fff;
	border: 2px solid #0550a3;
	color: #0550a3;
}

.mt-50 {
	margin-top: -50px;
}

/* #inquiry
---------------------------------------- */
#inquiry {
	padding: 45px 0;
	background: #00b3e6;
	color: #fff;
	font-size: 13px;
}

#inquiry .inner {
	width: 480px;
	margin: 0 auto;
}

#inquiry h2 {
	line-height: 1.1;
	text-align: left;
	color: #fff;
	font-size: 25px;
	font-weight: bold;
}

#inquiry .lead { text-align: left; }

#inquiry .tblSet {
	width: auto;
	margin-top: 25px;
}

#inquiry .tblSet .cell {
	width: 50%;
}

#inquiry .tblSet .cell:first-child { padding-right: 12px; }
#inquiry .tblSet .cell:last-child { padding-left: 12px; }

#inquiry .tblSet .cell .box {
	width: 220px;
	text-align: left;
}

#inquiry .tblSet .cell .box h4 {
	margin-bottom: 10px;
	line-height: 1.1;
	font-size: 14px;
	font-weight: normal;
}

#inquiry .tblSet .cell .box h4 + p {
	height: 65px;
	line-height: 1.5;
}

#inquiry .tblSet .cell .box .contact {
	display: table;
	width: 100%;
	height: 85px;
	background: #fff;
	padding: 10px 20px;
	color: #000;
	font-size: 12px;
}

#inquiry .tblSet .cell .box .contact dl {
	display: table-row;
}

#inquiry .tblSet .cell .box .contact dl dt,
#inquiry .tblSet .cell .box .contact dl dd {
	display: table-cell;
	vertical-align: middle;
}

#inquiry .tblSet .cell .box .contact dl dt.top,
#inquiry .tblSet .cell .box .contact dl dd.top { vertical-align: top; }

#inquiry .tblSet .cell .box .contact dl dt.btm,
#inquiry .tblSet .cell .box .contact dl dd.btm { vertical-align: bottom; }

#inquiry .tblSet .cell .box .contact dl dt {
	padding-right: 1em;
}

#inquiry .tblSet .cell .box .contact a {
	text-decoration: none;
	color: #000;
}

#inquiry .tblSet .cell .box .contact a:hover { text-decoration: underline; }

#inquiry .tblSet .cell .box .inqBtn { margin-top: 30px; }

#inquiry .tblSet .cell .box .inqBtn a {
	display: block;
	padding: 12px 10px 10px;
	background: #fff;
	border: 2px solid #fff;
	border-radius: 10px;
	line-height: 1.1;
	text-align: center;
	text-decoration: none;
	color: #29abe2;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-size: 13px;
	font-weight: bold;
}

#inquiry .tblSet .cell .box .inqBtn a:hover {
	background: #29abe2;
	color: #fff;
}

/* #inquiry02
---------------------------------------- */
#inquiry02 {
    width: 930px;
    margin: 0 auto;
    border-top: 2px solid #b4cae3;
    padding: 50px 0;
}
#inquiry02 .inner {
	display: flex;
    margin: 0 auto;
    width: 870px;
}
#inquiry02 .lead {
    line-height: 1.3;
    text-align: center;
    color: #4d4d4d;
    font-size: 24px;
    font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
    font-weight: bold;
}
#inquiry02 p {
    margin: 1em auto 0;
    text-align: left;
    line-height: 1.5;
    font-size: 13px;
}
#inquiry02 .tblSet {
    width: 100%;
    margin: auto;
    align-self: stretch;
    display: flex;
}
#inquiry02 .tblSet .cell {
    background-color: #efefef;
    padding: 1rem;
    margin: 20px 0.5rem;
    display: inline-block;
    border-radius: 10px;
    width: 70%;
}
#inquiry02 .tblSet .box {
    display: flex;
    flex-flow: column;
}
#inquiry02 dt.btm {
    float: left;
    margin-left: 20px;
}
#inquiry02 dl {
    font-size: 24px;
}
#inquiry02 .tblSet .cell .box .contact a:hover { text-decoration: underline; }

#inquiry02 .tblSet .cell .box .inqBtn { margin-top: 15px; }

#inquiry02 .tblSet .cell .box .inqBtn a {
	display: block;
	padding: 12px 10px 10px;
	background: #fff;
	border: 2px solid #fff;
	border-radius: 10px;
	line-height: 1.1;
	text-align: center;
	text-decoration: none;
	color: #29abe2;
	font-family: "webfont2", Meiryo, "メイリオ", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-size: 20px;
	font-weight: bold;
}
	span.email {
    font-size: 11px;
    float: left;
    margin-left: 0.5rem;
    margin-top: 3px;
	}
	.spshow {
		display: none;
	}

#inquiry02 .tblSet .cell .box .inqBtn a:hover {
	background: #29abe2;
	color: #fff;
}




/* ----------------------------------------
   スマホ対応
---------------------------------------- */
/* ウィンドウ幅が0〜479pxの場合に適用するCSS */
@media screen and (max-width:479px){
	.spOnly { display: block; }
	.spOnly.inlineBlock { display: inline-block; }
	.spOnly.inline { display: inline; }
	.pcOnly { display: none; }
	
	.column2R #main { padding: 0; }
	
	#aboutDospara .tblSet,
	#aboutDospara .tblSet .cell {
		display: block;
		width: 100%;
		margin-right: auto;
		margin-left: auto;
		padding-right: 0;
		padding-left: 0;
	}
	
	#aboutDospara h2 {
		margin: 0 0 20px;
		font-size: 24px;
	}
	#cashless .cashlessBox {
		width: 100%;
	}
	#cashless h2 {
		line-height: 1.4;
		text-align: left;
	}
	#cashless h2 span {
		font-size: 24px;
	}
	#aboutDospara img {
		max-width: 100%;
		height: auto;
	}
	
	#hero { padding: 30px 0; }
	
	#hero img { width: 80%; }
	
	#mainContents { padding: 0 10px; }
	
	#mainContents > section { padding: 20px 0; }
	
	#mainContents .linkTxt { text-align: right!important; }
	#mainContents .linkTxt a { font-size: 14px; }
	
	#history .tblSet .cell:first-child { margin-bottom: 1em; }
	#history .tblSet .cell:last-child { padding-left: 0; }
	
	#fivePoints .tblSet .cell { margin-top: 2em; }
	#fivePoints .tblSet .cell:first-child { margin-top: 0; }
	#fivePoints .set1 .cell:nth-child(2) { width: auto; }
	#fivePoints .tblSet p {
		max-width: none;
		margin-top: 0.5em;
		font-size: 14px;
	}
	#fivePoints .tblSet p span {
		display: inline-block;
		text-align: left;
		margin: auto;
	}
	
	#products .tblSet { margin-top: 10px; }
	#products .tblSet .cell,
	#products .tblSet .cell:first-child,
	#products .tblSet .cell:last-child { padding: 0; }
	#products .tblSet .cell { margin-top: 10px; }
	#products .tblSet .cell:first-child { margin-top: 0; }
	#products .tblSet .cell a { height: 185px; }
	#products .tblSet .cell a h3 { margin-bottom: 10px; }
	
	#service .tblSet { margin-top: 10px; }
	
	#service .tblSet .cell,
	#service .tblSet .cell .inner { width: auto!important; }
	#service .tblSet .cell { margin-top: 15px; }
	#service .tblSet .cell .inner h3 {
		height: auto;
		min-height: 50px;
		padding: 10px 0;
	}
	#service .tblSet .cell .inner p { font-size: 14px; }
	#service .linkTxt { margin-top: 0.5em!important; }
	
	#payment .box { width: auto; }
	#payment .box h2 {
		margin-bottom: 10px;
		font-size: 20px;
	}
	#payment .box h3 { font-size: 16px; }
	#payment .detailBtn a {
		padding: 10px 40px;
		border-radius: 5px;
		font-size: 16px;
	}
	
	#inquiry {
    padding: 20px 15px;
    font-size: 14px;
	}
	#inquiry .inner { width: auto; }
	#inquiry h2 {
		margin-bottom: 10px;
		line-height: 1.3;
	}
	#inquiry .tblSet { margin-top: 30px; }
	#inquiry .tblSet .cell { padding: 0!important; }
	#inquiry .tblSet .cell:last-child { margin-top: 20px; }
	#inquiry .tblSet .cell .box { width: auto; }
	#inquiry .tblSet .cell .box h4 { font-size: 18px; }
	#inquiry .tblSet .cell .box h4 + p {
		height: auto;
		margin-bottom: 10px;
	}
	#inquiry .tblSet .cell .box .contact {
		height: auto;
		font-size: 14px;
	}
	#inquiry .tblSet .cell .box .inqBtn { margin-top: 10px; }
	#inquiry .tblSet .cell .box .inqBtn a { font-size: 20px; }
	
	.mt-50 {
		margin-top: -20px;
	}	
	
	#inquiry02 {
		width: 100%;
	}
	#inquiry02 .inner {
		width: 100%;
		display: block;
		padding: 0 10px;
	}
	#inquiry02 .tblSet {
		display: block;
	}
	#inquiry02 .tblSet .cell {
		margin: 20px 0 0;
	}
	#inquiry02 .lead {
		font-size: 22px;
	}
	#inquiry02 h4 {
		font-size: 20px;
	}
	span.email {
		font-size: inherit;
		float: unset;
		margin: 0;
	}
	#inquiry02 .tblSet .cell .box .inqBtn a {
		font-size: 17px;
	}
	.nullDl {
		display: none;
	}
	.spshow {
		display: block;
	}

} /* スマホここまで */