@charset "UTF-8";

body,
input,
button,
select,
textarea {
	color: #000;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", MS PGothic, sans-serif;
	font-size: 1.2rem;
	letter-spacing: 0.05em;
}

img {
	height: auto;
	max-width: 100%;
	vertical-align: middle;
	border: 0;
	-ms-interpolation-mode: bicubic;
}

.container {
	margin-right: auto;
	margin-left: auto;
}

.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container,
.span12 {
	width: 1200px;
}

main#page-body,
#brandNavi {
	background: #fff;
}

.bannerPC {
	display: block !important;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}

p {
	margin: 0 0 10px;
}

#lp {
	margin-bottom: 150px;
}

.bannerPC {
	display: block !important;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}

.bannerSMP {
	display: none !important;
}

.itemimage {
	display: block !important;
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}

.setsuko {
	display: block;
	width: 750px;
	margin: auto;
}

.maintitle {
	font-size: 1.6em;
	text-align: center;
	line-height: 1.5;
	font-weight: bold;
	margin-top: 80px;
}

.maintext {
	font-size: 1.2em;
	text-align: center;
	margin-bottom: 50px;
	line-height: 1.5;
}

.pcbr {
	display: block !important;
}

.style_image {
	display: block !important;
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}

.subtext {
	font-size: 1.2em;
	text-align: left;
	margin-top: 50px;
	margin-bottom: 50px;
	line-height: 1.5;
}

.itemimage {
	display: block !important;
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}

.itemtitle {
	font-size: 1em;
	text-align: center;
	margin-top: 10px;
	line-height: 1.8;
}

.matometext {
	font-size: 1.2em;
	text-align: left;
	margin-top: 100px;
	line-height: 1.5;
}

.attentiontext {
	font-size: 1em;
	text-align: left;
	margin-top: 50px;
	margin-bottom: 30px;
	line-height: 1.5;
}

#brandNavi {
	clear: both;
	text-align: center;
	padding-bottom: 20px;
}

#brandNavi li svg {
	display: inline;
	width: 150px;
	max-width: 100%;
	text-align: center;
	margin: 0 auto;
	height: 65px;
}

@media screen and (max-width: 1280px){
	#brandNavi .container {
		width: 100%;
		min-width: auto;
	}

	#brandNavi li {
		min-width: 160px;
	}
}


/* for tablet */
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	.bannerSMP {
		display: none !important;
	}

	body,
	input,
	button,
	select,
	textarea {
		color: #000;
		font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", MS PGothic, sans-serif;
		font-size: 1.2em;
		letter-spacing: 0;
	}

	#page-body {
		padding: 0;
		width: auto;
	}

	body,
	input,
	button,
	select,
	textarea {
		font-size: calc(24* (100vw / 1200));
	}

	.container,
	.navbar-static-top .container,
	.navbar-fixed-bottom .container,
	.span12 {
		width: calc(1200* (100vw / 1200)) !important;
	}

	.maintitle {
		font-size: calc(22.5* (100vw / 1200));
		text-align: center;
		line-height: 1.5;
		font-weight: bold;
		margin-top: calc(80* (100vw / 1200));
	}

	.maintext {
		font-size: calc(17* (100vw / 1200));
		text-align: center;
		margin-bottom: calc(50* (100vw / 1200));
		line-height: 1.5;
	}

	.subtext {
		font-size: calc(17* (100vw / 1200));
		text-align: left;
		margin-top: calc(50* (100vw / 1200));
		margin-bottom: calc(50* (100vw / 1200));
		line-height: 1.5;
	}

	.itemtitle {
		font-size: calc(14* (100vw / 1200));
		text-align: center;
		margin-top: 10px;
		line-height: 1.8;
	}

	.matometext {
		font-size: calc(17* (100vw / 1200));
		text-align: left;
		margin-top: calc(100* (100vw / 1200));
		line-height: 1.5;
	}

	.attentiontext {
		font-size: calc(14* (100vw / 1200));
		text-align: left;
		margin-top: calc(50* (100vw / 1200));
		margin-bottom: calc(30* (100vw / 1200));
		line-height: 1.5;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.bannerSMP {
		display: block !important;
		width: 100%;
	}

	.bannerPC {
		display: none !important;
	}

	.container,
	.navbar-static-top .container,
	.navbar-fixed-bottom .container,
	.span12 {
		width: 1023px;
	}

	.container {
		margin-right: auto;
		margin-left: auto;
	}

	#lp {
		margin-bottom: calc(75* (100vw / 1023));
	}

	.setsuko {
		display: block;
		width: 100%;
		margin: auto;
	}

	.maintitle {
		font-size: calc(24* (100vw / 1023));
		text-align: center;
		line-height: 1.5;
		font-weight: bold;
		margin-top: calc(80* (100vw / 1023));

	}

	.maintext {
		font-size: calc(22* (100vw / 1023));
		text-align: left;
		margin-bottom: calc(50* (100vw / 1023));
		margin-top: calc(60* (100vw / 1023));
		;
		line-height: 1.5;
	}

	.pcbr {
		display: none !important;
	}

	.style_image {
		display: block !important;
		width: 70%;
	}

	.itemimage {
		display: block !important;
		width: 100%;
	}

	.subtext {
		font-size: calc(21* (100vw / 1023));
		text-align: left;
		margin-top: calc(50* (100vw / 1023));
		margin-bottom: calc(50* (100vw / 1023));
		line-height: 1.5;
	}

	.itemtitle {
		font-size: calc(18* (100vw / 1023));
		text-align: center;
		margin-top: 10px;
		line-height: 1.8;
	}

	.matometext {
		font-size: calc(22* (100vw / 1023));
		text-align: left;
		margin-top: calc(200* (100vw / 1023));
		line-height: 1.5;
	}

	.attentiontext {
		font-size: calc(19.5* (100vw / 1023));
		text-align: left;
		margin-top: calc(100* (100vw / 1023));
		margin-bottom: calc(160* (100vw / 1023));
		line-height: 1.5;
	}

	/* #brandNavi li svg {
		width: calc(180* (200vw / 1023));
	} */

	.header__inner {
		width: 95%;
	}

	.container,
	.navbar-static-top .container,
	.navbar-fixed-top .container,
	.navbar-fixed-bottom .container,
	.span12 {
		width: calc(1023* (100vw / 1023));
	}

	/* #Foot{
  width: 980px;
} */
	.header__brand-logo .img__wrapper {
		height: 100%;
		margin-left: 30px;
	}

	#Head.header--norc .header-item__icon {
		right: calc(-30 * (100vw / 768));
	}
}

@media screen and (max-width: 979px){
	#brandNavi {
		margin-top: 35px;
	}
}


@media screen and (max-width: 800px) {
	#lp {
		margin-bottom: 75px;
	}
	.maintitle {
		font-size: 14px;
	}

	.maintext {
		font-size: 12px;
	}

	.subtext {
		font-size: 12px;
	}

	.itemtitle{
		font-size: 11px;
	}

	.matometext{
		margin-top: 100px;
		font-size: 12px;
	}

	.attentiontext{
		font-size: 11px;
		margin-top: 50px;
		margin-bottom: 30px;
	}
}

/* for sp */
@media only screen and (max-width: 767px) {

	body,
	input,
	button,
	select,
	textarea {
		font-size: calc(24* (100vw / 750));
	}

	.body.container {
		padding: 0 calc(20* (100vw / 750));
		width: auto;
	}

	.container,
	.navbar-static-top .container,
	.navbar-fixed-bottom .container,
	.span12 {
		width: calc(750* (100vw / 750));
	}

	.bannerPC {
		display: none !important;
	}

	.bannerSMP {
		display: block !important;
		width: 100%;
	}

	.container {
		margin-right: auto;
		margin-left: auto;
	}

	#lp {
		margin-bottom: calc(75* (100vw / 750));
	}

	.setsuko {
		display: block;
		width: 100%;
		margin: auto;
	}

	.maintitle {
		font-size: calc(29* (100vw / 750));
		text-align: center;
		line-height: 1.5;
		font-weight: bold;
		margin-top: calc(80* (100vw / 750));
	}

	.maintext {
		font-size: calc(24* (100vw / 750));
		text-align: center;
		margin-bottom: calc(50* (100vw / 750));
		line-height: 1.5;
	}

	.pcbr {
		display: none !important;
	}

	.style_image {
		display: block !important;
		width: 70%;
	}

	.itemimage {
		display: block !important;
		width: 100%;
	}

	.subtext {
		font-size: calc(24* (100vw / 750));
		text-align: left;
		margin-top: calc(50* (100vw / 750));
		margin-bottom: calc(50* (100vw / 750));
		line-height: 1.5;
	}

	.itemtitle {
		font-size: calc(21* (100vw / 750));
		text-align: center;
		margin-top: 10px;
		line-height: 1.8;
	}

	.matometext {
		font-size: calc(24* (100vw / 750));
		text-align: left;
		margin-top: calc(200* (100vw / 750));
		line-height: 1.5;
	}

	.attentiontext {
		font-size: calc(21* (100vw / 750));
		text-align: left;
		margin-top: calc(100* (100vw / 750));
		margin-bottom: calc(160* (100vw / 750));
		line-height: 1.5;
	}

	#brandNavi li svg {
		width: calc(180* (100vw / 750));
	}

	.header__inner {
		width: calc(750* (100vw / 750));
	}

	.container,
	.navbar-static-top .container,
	.navbar-fixed-top .container,
	.navbar-fixed-bottom .container,
	.span12 {
		width: calc(750* (100vw / 750));
	}

}