/* ///////////// header /////////////*/
header{
  position: relative!important;
}
/* /////// titleares 各キャプションタイトル欄 ///////*/
.titlearea{
  width: 100%;
  border-bottom: solid 2px #0066CC;
}
.titlename{
  font-family: 'Oswald', sans-serif;
  font-size: 2.4rem;
  color: #333300;
  display: inline-block;
  border-bottom: solid 1px #000000;
}
.subtitle{
  font-family: 'Open+Sans', sans-serif;
  font-size: 1rem;
  color: #333300;
  display: inline-block;
}
.content-item {
  width: 100%;
  display: inline-block;
  background: #fff;
  border: 2px solid #AAAAAA;
  border-radius: 10px;
  cursor: pointer;
  position: relative;
}
.content-item p{
  color: #AAAAAA;
  line-height: 2.1;
}
.content-item:hover {
	background: #0066FF;
  border: 2px solid #0066FF;
  border-radius: 10px;
}
.content-item p:hover {
	color: #FFFFFF;
}
p.sub-title{
	font-size: 1.8rem;
	line-height: 1.8;
	border-bottom: 1px dotted #000000;
}
p.sub-title2{
	font-size: 1.6rem;
	line-height: 1.8;
}
p.basic{
	font-size: 1.2rem;
	line-height: 1.6;
}
p.basic2{
	font-size: 1.2rem;
	line-height: 1.6;
	border-bottom: 1px dotted #000000;
}
p.heading{
	font-size: 2.4rem;
	line-height: 1;
}
/* ///////////// explanation /////////////*/
#explanation{
  width: 96%;
  margin: 0 auto;
}
#explanation a:link{
  color: #006cb7!important;
  border-bottom: 1px solid #006cb7!important;
}
#explanation a:visited {
  color: #9400D3;
}
#explanation a:hover {
  background: #FDF5E6;
}
#explanation img{
  width: 100%;
  height: auto;
}
#explanation h1{
	font-family: 'Oswald', sans-serif;
	font-size: 3.2rem;
	color: #DC143C;
}
table.stores{
	width: 75%;
	margin: 0 auto;
}
table.stores tr td{
	vertical-align: middle;
}
td.step{
	width: 10%;
}
.precautionary-statement{
	width: 60%;
	margin: 0 auto;
	border: 5px dotted #DC143C;
	border-radius: 20px;
}
.policy{
	width: 60%;
	margin: 0 auto;
	border: 5px solid #FF8C00;
	border-radius: 20px;
}
/* ///////////// shop-info /////////////*/
#shop-info{
	width: 96%;
	margin: 0 auto;
}
#shop-info h2{
	font-family: 'Oswald', sans-serif;
	font-size: 2.8rem;
	line-height: 1.2;
	color: #DC143C;
}
#shop-map{
	width: 80%;
	margin: 0 auto;
}
table.list{
  width: 100%;
  margin:0 auto;
}
.list td{
  padding: 10px;
  border: 1px solid #ddd;
}
td.tel{
	width: 15%;
}
td.mail{
	width: 25%;
}
td.hour{
	width: 15%;
}
#shop-info a:link{
  color: #006cb7!important;
  border-bottom: 1px solid #006cb7!important;
}
#shop-info a:visited {
  color: #9400D3;
}
#shop-info a:hover {
  background: #FDF5E6;
}
/* ///////////// products-brands /////////////*/
#products-brands{
	width: 96%;
	margin: 0 auto;
}
#products-brands h2{
	font-family: 'Oswald', sans-serif;
	font-size: 2.4rem;
	line-height: 1.2;
	color: #DC143C;
}
.more{
	font-family: 'Oswald', sans-serif;
	font-weight: bold;
	font-size: 3rem;
	color: #DC143C;
}
.brand-carousel{
  width: 100%;
  padding: 5px;
  border: dotted 1px #C8C8C8;
}
.brand-carousel img {
  width: 100%;
  height: auto;
}
.brandname{
  font-size: 0.6rem;
  font-weight: 500;
  text-align: center;
  color: #4169E1;
}
@media (max-width:991.98px){
.brandname{
  font-size: 1.2rem;
}
}
@media (max-width:767.98px){
.brandname{
  font-size: 0.7rem;
}
}
@media (max-width:543.98px){
.brandname{
  font-size: 0.5rem;
}
}
.brand-carousel:hover .brandname{
  background-color: #DC143C;
  color: #FFFFFF;
  opacity: 0.7;
}
.brand-carousel a:hover img{
  background-color: #FFEFD5;
  opacity: 0.7;
}
/* ///////// button-area /////////*/
#button-area{
	width: 80%;
	margin: 0 auto;
}
.btn-outline-danger{
	border-width: 3px!important;
}
/* ///////// テキストカラー変更用 /////////*/
.caution{
	color: #DC143C;
	border-bottom: 1px dotted #DC143C;
}
.shipping-policy{
	font-size: 1.6rem;
	line-height: 1.8;
	color: #FF8C00;
}
/* ///////// メディアクエリ纏めて記載 /////////*/
@media only screen and (max-width:768px){
table.stores{
	width: 100%;
}
.precautionary-statement{
width: 100%;
}
.policy{
width: 100%;
}
#shop-map{
width: 100%!important;
}
.list{
  margin: 0 -10px;
}
.list td{
width: 100%;
display: block;
border-top: none;
}
.list tr:first-child th{
  border-top: 1px solid #ddd;
}
td.step{
	width: 15%;
}
td.shop-name{
	background: #f4f4f4;
}
td.tel{
	width: 100%;
}
td.mail{
	width: 100%;
}
td.hour{
	width: 100%;
}
}
@media only screen and (max-width:479.98px){
td.step{
	width: 20%;
}
}