@charset "UTF-8";
/** Common CSS Code**/
/**これは見た目のcss**/

#Catalog .Catalog_Index ul {
	padding: 0;
	margin: 0 auto 5px auto;;
	list-style: none;
	width: 100%;
}

#Catalog .Catalog_Index ul li {
	padding: 0;
	margin: 0;
	width: 20%;
	vertical-align: top;
	display: inline-block;
	font-size: 90%;
}

#Catalog .Catalog_Index ul li .listBox {
	margin: 0 10px 10px 10px;
}

#Catalog .Catalog_Index ul li .listBox .titile {
	background-color: #000000;
	color: #ffffff;
}

#Catalog .Catalog_Index ul li .imgBox {
	width: 100%;
	height: 150px;
	border: #000000 solid;
	border-width: 0 1px;
	overflow: hidden;
}

#Catalog .Catalog_Index ul li .imgBox .img {
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: cover;
	transition: 0.5s;
}

#Catalog .Catalog_Index ul li a:hover .imgBox .img {
	transform: scale(1.2);
	transition: 0.5s;
}

#Catalog .Catalog_Index ul li a .nextBtn {
	color: #000000;
	transition: 0.2s;
}

#Catalog .Catalog_Index ul li a:hover .nextBtn {
	opacity: 0.5;
	transition: 0.2s;
}

#Catalog .Catalog_Index .catalogPager .pager {
	padding: 10px 0 20px 0;
	margin: 0 auto 10px auto;
	border: #000000 solid;
	border-width: 0 0 1px 0;
	display: block;
}

#Catalog .Catalog_Index .catalogPager .pager a {
	margin: 0 5px;
	
}

#Catalog .sqBtn {
	margin: 0 auto 20px auto;
	padding: 10px 15px;
}

#Catalog .CategorysqBtn {
	margin: 10px 10px 0 0;
	font-size: 90%;
}

#editorBox .CategorysqBtn {
	margin: 10px 10px 0 0;
	padding: 5px 20px!important;
	font-size: 90%;
	width: auto!important;
}


/** テンプレート **/

table.tmp_table {
	width: 100%;
	font-size: 90%;
	border: #000000 solid;
	border-width: 1px 0 0 1px;
	margin: 50px auto 0 auto;
}

#NewsBox_index table.tmp_table {
	margin: 0 auto;
}

table.tmp_table th,
table.tmp_table td {
	width: 100%;
	border: #000000 solid!important;
	border-width: 0 1px 1px 0!important;
	padding: 5px 10px!important;
	font-weight: normal;
	line-height: 1.5em;
}

table.tmp_table th,
table.tmp_table td.item {
	background-color: #ffd791!important;
	white-space: nowrap;
}

table.tmp_table th {
	text-align: center;
	width: 6em;
}

#CatalogDetail #DetailBox table.tmp_table {
	margin: 0 auto 20px auto;
}

#CatalogDetail #DetailBox iframe {
	margin: 25px auto;
	width: 100%;
}

#CatalogDetail #DetailBox .Main_photo {
	margin: 20px auto 30px auto;
}

#CatalogDetail #DetailBox .DetailSub {
	margin: 0 auto 20px auto;
	text-align: left;
}

#CatalogDetail #DetailBox .Sub_photo {
	width: calc(100% / 5 - 10px);
	height: 100px;
	background-color: transparent;
}

#CatalogDetail #DetailBox .Sub_photo a {
    width: 100%;
	height: 100%;
    position: relative;
    display: inline-block;
    top: auto;
    transform: translateY(0);
	text-align: center;
}


#CatalogDetail #DetailBox .Sub_photo a img {
	max-height: 100%;
	max-width: 100%;
	width: auto;
	top: 50%;
	transform: translateY(-50%);
}

#CatalogDetail #DetailBox .comment_box {
	margin: 0 auto;
	padding: 0;
	border-radius: 0;
}

/** 2カテゴリー用 **/
#Catalog.clossCat h2 {
	background-color: #000000;
	padding: 5px 20px;
	margin: 10px;
	color: #ffffff;
}

#Catalog.clossCat h2 a {
	position: absolute;
	right: 30px;
	font-size: 90%;
	color: #ffffff;
}

#Catalog.clossCat h2 a:hover {
	color: #cccccc;
}

#Catalog.clossCat .Catalog_Index ul li {
	line-height: 1.5em;
}

#Catalog.clossCat .Catalog_Index ul li .imgBox {
    width: 100%;
    height: 150px;
    border: #dedede solid;
    border-width: 1px;
    overflow: hidden;
	margin: 0 0 10px 0;
	text-align: center;
	padding: 10px;
}

#Catalog.clossCat .Catalog_Index ul li .imgBox img {
	max-height: 100%;
	max-width: 100%;
}

#Catalog.clossCat .Catalog_Index ul li .imgBox img:hover {
	transform: scale(1.2);
	opacity: 0.5;
}

#Catalog.clossCat img.list_arrow {
	margin: 0 0 0 5px;
}

#CatalogDetail #NewsBox_Detail .DetailList_pc,
#CatalogDetail #NewsBox_Detail .DetailList_sp {
	font-size: 90%;
	line-height: 1.3em;
	text-align: left;
}

#CatalogDetail .DetailList a .sideBox {
	background-color: transparent;
	text-align: center;
	width: 100%;
	height: 100px;
	border-width: 0;
}

#CatalogDetail .osusume {
	background-color: transparent;
	border: #cccccc solid;
	border-width: 1px;
	color: #000000;
}

#CatalogDetail .DetailList a .sideBox img {
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
}

#CatalogDetail .DetailList a:hover .sideBox img {
	transform: scale(1.2);
}

#CatalogDetail .comment_box .tmpBox {
	margin: 20px auto 0 auto;
}

#CatalogDetail #DetailBox .Main_photo .chMain_photo {
	box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
}



/***************************************************************************/


/* ------------------------------------------------------ */
/* Media Query for Lenobo to SmartPhone */
@media only screen and (max-width : 1280px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
/* Media Query for Lenobo to SmartPhone */
@media only screen and (max-width : 700px) {
/* ------------------------------------------------------ */
	
}


/* ------------------------------------------------------ */
@media only screen and (max-width : 1920px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 1336px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 1250px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 1024px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 920px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 810px) {
/* ------------------------------------------------------ */
#Catalog .Catalog_Index ul li {
	width: 50%;
}
}

/* ------------------------------------------------------ */
@media only screen and (max-width : 640px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 600px) {
/* ------------------------------------------------------ */
#Catalog .Catalog_Index ul li {
	width: 100%;
}

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 480px) {
/* ------------------------------------------------------ */

}

/* ------------------------------------------------------ */
@media only screen and (max-width : 320px) {
/* ------------------------------------------------------ */ 

}