@charset "utf-8";
/* page title */
.ttl {
	background: url("../images/ttl_products.jpg") 50% 0 no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
}

/* news list */
/***********************************/
#interior-dl,
.newsdetail {margin: 0 1em 2em;}

#interior-dl dl,
.newsdetail dl {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}
.List.read dt,
#interior-dl dt {
	color: #3271b2;
	width: 9.8em;
}

.List.read dt span,
#interior-dl dt span {
	color: #cc0000;
	padding:0 5px;
}
.List.read dd,
#interior-dl dd {
	width: calc(100% - 10em);
	padding-bottom: .8em;
	margin-bottom: .8em;
	position: relative;
}
.List.read dd::after,
#interior-dl dd::after {
	content: '';
	width: calc(100% + 10em);
	height: 1px;
	background-color: #bcbcbc;
	position: absolute;
	bottom: 0;
	left: -10em;
}

.List.read a,
#interior-dl a {color:#1e1e1e;text-decoration:none;}
.List.read a:hover,
#interior-dl a:hover {text-decoration:underline;}
.List.read a:focus,
#interior-dl a:focus {outline:none;}

/* paging */
.paging {
	text-align: center;
	margin-bottom: 3em;
}
.paging li {display:inline-block;}
.paging li a {
	color:#1e1e1e;
	font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
}

@media screen and (min-width:641px) {
	.List.read dt,
	#interior-dl dt,
	.List.read dd,
	#interior-dl dd {font-size: 2vw;}
	.paging {font-size: 1.6vw;}
}
@media screen and (min-width:768px) {
	.List.read dt,
	#interior-dl dt,
	.List.read dd,
	#interior-dl dd {font-size: 1.4rem;}
	.paging {font-size: 1.1rem;}
}
@media screen and (min-width:801px) {
	#interior-dl,
	.newsdetail {margin-left: 2em;}
}
@media screen and (min-width:1240px) {}

@media screen and (max-width:640px) {
	.List.read dt,
	#interior-dl dt,
	.List.read dd,
	#interior-dl dd {font-size: 2vw;}
	.paging {font-size: 1.6vw;}
}
@media screen and (max-width:480px) {
	.List.read dt,
	#interior-dl dt,
	.List.read dd,
	#interior-dl dd {font-size: 2.8vw;}
	.paging {font-size: 2.2vw;}
}
@media screen and (max-width:360px) {
	.List.read dl,
	#interior-dl dl {display: block;}
	.List.read dt,
	#interior-dl dt {
		font-size: 3.2vw;
		padding: 0 .5em;
		width: 100%;
	}

	.List.read dd,
	#interior-dl dd {
		font-size: 3.2vw;
		width: 100%;
		padding: .3em .5em .8em;
	}
	.List.read dd::after,
	#interior-dl dd::after {
		width: 100%;
		left: 0;
	}
	.paging {font-size: 3vw;}
}
@media screen and (max-width:320px) {
	.List.read dt,
	#interior-dl dt {font-size: 3.6vw;}
	.List.read dd,
	#interior-dl dd {font-size: 3.4vw;}
	.paging {font-size: 3vw;}
}


/* detail */
.newsdetail h2 {
	padding: 0 1em .5em;
	margin-bottom: 2px;
	border-bottom: 1px solid #d7d7d7;
	position: relative;
}
.newsdetail h2::before {
	content: '';
	display: block;
	width: 4px;
	height: calc(100% - 10px);
	background-color: #cf0e31;
	position: absolute;
	top: -1px;
	left: 0;
}
.newsdetail .date {
	color: #3271b2;
	text-align: right;
	margin-bottom: 20px;
}
img.fancybox-image {
   border: 4px solid #fff;
	border-radius: 10px;
}

.newsdetail .sec {
	line-height: 1.8;
	margin-bottom: 25px;
}

ul.list {
	list-style-type: disc;
	margin-left: 1em;
}
@media screen and (min-width:641px) {
	.newsdetail h2 {font-size: 3.4vw;}
	.newsdetail .date {font-size: 1.8vw;}
	.newsdetail .sec {font-size: 2.2vw;}
	ul.list {font-size: 2.2vw;}
}
@media screen and (min-width:768px) {
	.newsdetail h2 {font-size: 2rem;}
	.newsdetail .date {font-size: 1.2rem;}
	.newsdetail .sec {font-size: 1.4rem;}
	ul.list {font-size: 1.4rem;}
}
@media screen and (min-width:1240px) {}
@media screen and (max-width:640px) {
	.newsdetail h2 {font-size: 3.4vw;}
	.newsdetail .date {font-size: 1.8vw;}
	.newsdetail .sec {font-size: 2.2vw;}
	ul.list {font-size: 2.2vw;}
}
@media screen and (max-width:480px) {
	.newsdetail h2 {font-size: 3.8vw;}
	.newsdetail .date {font-size: 2.8vw;}
	.newsdetail .sec {font-size: 3vw;}
	ul.list {font-size: 3vw;}
}
@media screen and (max-width:360px) {
	.newsdetail h2 {font-size: 4vw;}
	.newsdetail .date {font-size: 3vw;}
	.newsdetail .sec {font-size: 3.4vw;}
	ul.list {font-size: 3vw;}
}




/*
.paging,
.section {
	margin-bottom:30px;
}

.snavi a {
	font-size: 1.4rem;
	text-decoration: none;
	display: block;
	min-height: 42px;
	padding: 15px 10px 15px 30px;
	transition: all 0.4s;
}
.snavi a:hover,
.snavi a:active {
	color: #fff;
	background-color: #a99f93;
}

a {
	text-decoration:underline;
}

input,
textarea,
select {font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

a:hover {
	text-decoration:none;
}

a:focus {outline:none;}

img {border:none;}

ul, ol {list-style:none;}

table {
	border-collapse:collapse;
}

/* clearfix *
.clearfix {width:100%;}
.clearfix:after {
	content: ""; 
	display: block; 
	clear: both;
}

*:after {
  display:block;
  clear:both;
} /* この記述は固定です */

/* news list in homepage */
/***********************************
#interior-dl,
.newsdetail {padding-left: 20px;}

.List.read a,
#interior-dl a {color:#1e1e1e;text-decoration:none;}
.List.read a:hover,
#interior-dl a:hover {text-decoration:underline;}
.List.read a:focus,
#interior-dl a:focus {outline:none;}

/* float dl, dt, dd *
.List.read dt,
#interior-dl dt {
	color: #3271b2;
	font-size:1.4rem;
	float: left;
	padding: 0;
	height: 24px;
}
.List.read dt span,
#interior-dl dt span {
	color: #cc0000;
	padding:0 5px;
}

p {font-size: 1.3rem;}
.List.read dd,
#interior-dl dd {
	color:#1e1e1e;
	font-size:1.4rem;
	padding:0px 0 10px 150px;
	margin-bottom:8px;
	border-bottom: 1px solid #bcbcbc;
	min-height: 24px;
}
.List.read dt dd a,
#interior-dl dd a {display:block;}

/* paging *
.paging {text-align:center;font-size:1.1em;}
.paging li {display:inline-block;}
.paging li a {color:#1e1e1e;font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;}



/* detail *
.newsdetail h2 {
	font-size: 2rem;
	padding:0 20px 10px;
	margin-bottom: 2px;
	border-bottom: 1px solid #d7d7d7;
	position: relative;
}
.newsdetail h2::before {
	content: '';
	display: block;
	width: 4px;
	height: calc(100% - 10px);
	background-color: #cf0e31;
	position: absolute;
	top: -1px;
	left: 0;
}
.newsdetail .date {
	color: #3271b2;
	font-size: 1.2rem;
	text-align: right;
	margin-bottom: 20px;
}
img.fancybox-image {
   border: 4px solid #fff;
	border-radius: 10px;
}

.newsdetail .sec {
	font-size: 1.4rem;
	line-height: 1.6;
	margin-bottom: 25px;
}

ul.list {
	font-size: 1.4rem;
	list-style-type: disc;
	margin-left: 1em;
}