@charset "UTF-8";
/* ===================================================================
 style info : TOPページの設定
 author     : top.css
=================================================================== */

/*------------------------------------------------------------------------------------------l-wrap*/
#l-wrap {
	width: 100%;
	margin: 0 auto;
	text-align: left;
	background: url(../images/common/bg.png) no-repeat top center;
}

/*------------------------------------------------------------------------------------------c-mainImg*/
#c-mainImg {
	width: 1360px;
	max-width: 1360px;
	height: 100%;
	margin: 0 auto 139px auto;
	text-align: center;
	position: relative;
}
#c-mainImg img {
	width: auto;
	/*min-width: 100%;*/
	height: auto;
	margin: 0 auto;
}
#c-mainImg .catch {
	width: 613px;
	/*background:rgba( 255, 255, 255, 0.7 );*/
	/*color: #333;*/
	position: absolute;
	z-index: 2001;
	bottom: 25px;
	text-align: left;
}
#c-mainImg .slideImg {
	width: 100%;
	margin: 0 auto;
}

/*既存のBxSliderのCSSを打ち消す*/
#c-mainImg .bx-wrapper {
	width: 1159px;
	margin: 0 0 0 auto;
	box-shadow: none;
	border: none;
	background: #fff;
}
#c-mainImg .bx-wrapper .bx-pager.bx-default-pager a {
  background: #a4adbb;
  text-indent: -9999px;
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  outline: 0;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
#c-mainImg .bx-wrapper .bx-pager.bx-default-pager a:hover,
#c-mainImg .bx-wrapper .bx-pager.bx-default-pager a.active,
#c-mainImg .bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #30486f;
}

/*------------------------------------------------------------------------------------------l-container_top（TOPのみ100％表示）*/
#l-container_top {
	width: 100%;
	overflow: hidden;
	margin: 0 auto;
	padding: 163px 0 0 0;
}
.c_articleBlock {
	width: 100%;
	max-width: 1360px;
	margin: 0 auto 143px auto;
	position: relative;
}
.c_articleBlock02 {
	width: 100%;
	margin: 0 auto 105px auto;
	position: relative;
}
.c_articleBlock .imgBox {
	width: 640px;
}
.c_articleBlock .txtBox {
	position: absolute;
	top: 40px;
	margin: 0 0 0 644px;
	line-height : 1.95;
}
.c_articleBlock .txtBox .post {
	width: 640px;
	height: 400px;
	background: rgba( 210, 210, 210, 0.8 );
	padding: 45px 0 45px 70px;
}
.c_articleBlock .txtBox .post h3 {
	font-family: -apple-system, blinkMacSystemFont, "HiraKakuProN-W3","Hiragino Kaku Gothic ProN", Meiryo, YuGothic-M, YuGothic, sans-serif;
	font-size: 3rem;
	font-weight: normal;
	line-height: 1.3;
	margin: 0 0 15px 0;
	letter-spacing: 0.1em;
}
.c_articleBlock .txtBox .post .p_detail a{
	margin:0;
	background: none;
}
.c_hBlock_r {
	width: 50%;
	margin: 0 0 0 auto;
	padding: 0 0 0 26px;
}
.c_hBlock_l {
	width: 50%;
	margin: 0 auto 0 0;
	padding: 0 26px 0 0;
	text-align: right;
}
article .c_hBlock_l p{
	text-align:right;
}
/*------------------------------------------------------------------------------------------productsList*/
.productsList {
	width: 1360px;
	margin: 0 auto 143px auto;
}
.productsList li {
	background: #333;
	width: 25%;
	float: left;
	position: relative;
	font-size:2.2rem;
	font-weight: bold;
}

/*画像を拡大*/
a.thumnail {
    display: block;
    float: left;
    overflow: hidden;
    width: 100%;
}
.thumnail span{
	z-index: 2;
} 
.productsList li img {
    height: auto;
    -webkit-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    width: 100%;
    vertical-align: bottom;
}
 
figure {
    margin: 0;
    overflow: hidden;
    position: relative;
    text-align: center;
}
 
figcaption {
    background-color:rgba(0,0,0,0.25);
    color: #FFF;
    opacity: 0;
    font-size: 16px;
    font-size: 2.2rem;
    position: absolute;
    text-align: center;
    -webkit-transition:all 0.25s ease-in-out;
        transition:all 0.25s ease-in-out;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    padding-top: 25%;
}

a:hover>figure img {
        transform: scale(1.15,1.15);
        -webkit-transform:scale(1.15,1.15);
        -moz-transform:scale(1.15,1.15);
        -ms-transform:scale(1.15,1.15);
        -o-transform:scale(1.15,1.15);
}
 
a:hover>figure figcaption {
    opacity: 1;
}
.productsList li span {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 238px;
	height: 52px;
	background: none;
}
.productsList li.c_ichiran {
	width: 340px;
	height: 250px;
	background: #d4d1d1;
	font-size:1.6rem;
}
.productsList li.c_ichiran span{
	padding: 14px 20px;
}

.productsList li.c_ichiran figcaption {
    background-color:#d4d1d1;
	-webkit-transition:all 1s ease-in-out;
        transition:all 1s ease-in-out;
}