@charset "utf-8";

/* widequick130 */
.widequick130 {position:relative; width:100%; height:100%; float:left; box-sizing:border-box; overflow:hidden;}

.widequick130 .wq130_wrap {clear:both; position:relative; width:100%; margin:0 auto; text-align:center; padding:1px 15px; box-sizing:border-box;}
.widequick130 .wq130_wrap > div {position:relative; display:inline-block; height:155px; text-align:center; box-sizing:border-box; overflow:hidden;
								vertical-align:top; margin:0 6px; -webkit-transition:background 0.5s, padding 0.5s; transition:background 0.5s, padding 0.5s;}
.widequick130 .wq130_wrap .hexagon {clip-path:polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);}								

.widequick130 .wq130_wrap > div img {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:inline-block; min-width:100%; max-height:100%;
									-webkit-transition:all 0.5s;}

.widequick130 .wq130_wrap a {width:100%; height:100%;}
.widequick130 .wq130_wrap a:focus {outline:thin dotted;}

.widequick130 .wq130_wrap .txtbox {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; padding:0 10px; box-sizing:border-box; text-align:center;}
.widequick130 .wq130_wrap .txtbox .no {font-size:18px; font-weight:600; color:#2a3835; display:block;}
.widequick130 .wq130_wrap .txtbox .tit {font-size: 15px; color:#2a3835; font-weight:400; line-height:130%; letter-spacing:-0.5px;
										width:100%; margin-top:10px; overflow:hidden; word-break:keep-all; white-space:normal;
										-webkit-line-clamp:2; max-height:38px; -webkit-box-orient:vertical; display:-webkit-box;}

.widequick130 .wq130_wrap > div:hover img {min-width:120%; max-height:120%;}
.widequick130 .wq130_wrap > div:hover .tit {font-weight:600;}

/* layout */
.borderbox .widequick130 .wq130_wrap,
.border-radius .widequick130 .wq130_wrap {padding:10px 15px;}

	@media (min-width:800px){}

	@media (min-width:1050px){
		.widequick130 .wq130_wrap > div {width:10.7%;}
		.widequick130 .wq130_wrap > div:first-child,
		.widequick130 .wq130_wrap > div:nth-child(8n+1) {margin-left:0;}
		.widequick130 .wq130_wrap > div:nth-child(8n),
		.widequick130 .wq130_wrap > div:last-child {margin-right:0;}
		.widequick130 .wq130_wrap > div:nth-child(8) ~ div {margin-top:10px;}
	}
	
	@media (max-width:1050px){}


	@media (min-width:600px) and (max-width:1049px){
		.widequick130 .wq130_wrap > div {float:left; width:18.4%; margin:0 2% 0 0;}
		.widequick130 .wq130_wrap > div:nth-child(5n) {margin-right:0;}	
	}
	@media (min-width:800px) and (max-width:1049px){
		.widequick130 .wq130_wrap > div:nth-child(5n) ~ div {margin-top:20px;}
	}
	

	@media (max-width:799px){
		.widequick130 .wq130_wrap h3 {font-size:15px; font-weight:400; max-height:35px; line-height:18px;}
		.widequick130 .wq130_wrap > div:hover {padding:0;}
		.widequick130 .wq130_wrap > div:hover img {opacity:0.8;}
	}
	@media (min-width:600px) and (max-width:799px){
		.widequick130 .wq130_wrap > div:nth-child(5n) ~ div {margin-top:10px;}
	}

	@media (max-width:599px){
		.widequick130 .wq130_wrap {padding:10px 15px;}
		.widequick130 .wq130_wrap > div {float:left; width:23.5%; margin:0 2% 0 0;}
		.widequick130 .wq130_wrap > div:nth-child(4n) {margin-right:0;}	
		.widequick130 .wq130_wrap > div:nth-child(4n) ~ div {margin-top:10px;}
		.widequick130 .wq130_wrap > div:first-child {margin-left:0;}
	}