/* 新着の注目プロジェクト */
.new_snip {
  position: relative;
  overflow: hidden;
  width: 100%;
  box-shadow: none !important;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #ffffff;
  font-size: 16px;
		font-weight:bold;
}
.new_snip * {
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.new_snip img {
  width: 100%;
  vertical-align: top;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.new_snip .border {
  position: absolute;
  opacity: 0.45;
  z-index: 12;
}
.new_snip .border:before,
.new_snip .border:after,
.new_snip .border div:before,
.new_snip .border div:after {
	background-color: #f5b043;
	position: absolute;
	content: "";
	display: block;
	-webkit-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
.new_snip .border:before,
.new_snip .border:after {
	width: 0;
	height: 1px;
}
.new_snip .border div:before,
.new_snip .border div:after {
	width: 1px;
	height: 0;
}
.new_snip .border.one {
	left: 6px;
	top: 6px;
	right: 12px;
	bottom: 12px;
}
.new_snip .border.one:before,
.new_snip .border.one div:before {
	left: 0;
	top: 0;
}
.new_snip .border.one:after,
.new_snip .border.one div:after {
	bottom: 0;
	right: 0;
}
.new_snip .border.two {
	left: 12px;
	top: 12px;
	right: 6px;
	bottom: 6px;
}
.new_snip .border.two:before,
.new_snip .border.two div:before {
	right: 0;
	top: 0;
}
.new_snip .border.two:after,
.new_snip .border.two div:after {
	bottom: 0;
	left: 0;
}
.new_snip figcaption {
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	position: absolute;
	padding: 30px;
	background-color: rgba(0, 0, 0, 0.2);
}
.new_snip a {
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	position: absolute;
	z-index: 1;
}
.new_snip:hover .border:before,
.new_snip:hover .border:after,
.new_seemore:hover .border:before,
.new_seemore:hover .border:after{
	width: 100%;
}
.new_snip:hover .border div:before,
.new_snip:hover .border div:after,
.new_seemore:hover .border div:before,
.new_seemore:hover .border div:after{
	height: 100%;
}
.new_snip:hover figcaption,
.new_seemore:hover figcaption{
	opacity: 0.9;
	background-color: #000;
}

.new_snip:hover figcaption{
	z-index:10;
}


figure.new_snip .type,
.new_seemore .type{
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.new_snip:hover .type,
.new_seemore:hover .type{
	opacity: 0.3;
}



/* 文字部分 */

figure.new_snip h3,
figure.new_snip .textOverflow,
figure.new_snip span {
	margin: 0;
	position: absolute;
	left: 0;
	opacity: 0;
	text-align:center;
	width:100%;
}

figure.new_snip h3 {
	padding: 0 30px;
	display: inline-block;
	top: 12%;
	-webkit-transform: translate3d(0%, -100%, 0);
	transform: translate3d(0%, -100%, 0);
	font-size: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

figure.new_snip span{
	display:block;
	margin-top:10px;
	font-size:16px;
  -webkit-transform: translate3d(0%, 100%, 0);
  transform: translate3d(0%, 100%, 0);
		bottom:15%;
		font-weight:bold;
}

figure.new_snip a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}

#newest section a:hover{ /* 追加 */
  opacity: 1;
}

.new_seemore:hover figcaption h3,
figure.new_snip:hover figcaption h3,/* top_contentなどで使用 */
.new_seemore:hover figcaption p,
figure.new_snip:hover figcaption p,
.new_seemore:hover figcaption span,
figure.new_snip:hover figcaption span{
  -webkit-transform: translate3d(0%, 0%, 0);
  transform: translate3d(0%, 0%, 0);
}

.new_seemore:hover figcaption h3,
figure.new_snip:hover figcaption h3 {
  opacity: 0.9;
}
.new_seemore:hover figcaption p,
figure.new_snip:hover figcaption p {
  opacity: 0.6;
}

.new_seemore:hover figcaption span,
figure.new_snip:hover figcaption span {
  opacity: 1;
}


/* 黄色いボタンが出る */

.back_bg_foot,.back_bg {
background: url(https://a4d8dc.claudeassets.com/20220908084316im_/https://cf-hikaku.net/wp-content/uploads/thumbnail/no_image.jpg)no-repeat;
background-size: cover;
background-position: center center;
}

.back_bg_foot {
height: 177px!important;
}

.back_bg {
height: 135px!important;
}

.snip {
   width: 100%;
   height: 100%;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   cursor: pointer;
	font-weight:bold;
}

.snip .mask,.snip .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
			z-index: 20;
}
.snip img {
   display: block;
   position: relative;
			width: 100%;
/* opacity:0.8; */
}

/* ie対策 画像サイズ */

.col_4_small .snip img {
	max-height:136px;
}


.snip h2 {
   text-transform: uppercase;
   color: #e7b322;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 6px 10px;
   background: rgba(0, 0, 0, 0.8);
			/* background: rgba(255, 255, 255, 0.25);*/
   margin: 10px 0;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
}
.snip .mask p {
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 0 20px;
   text-align: center;
}

.snip .info {
		display: inline-block;
		padding: 6px;
		background: #e7b322;
		color: #333;
		-webkit-box-shadow: 0 0 1px #000;
		-moz-box-shadow: 0 0 1px #000;
		box-shadow: 0 0 1px #000;
		border-radius: 40px;
		margin-top: 10px;
		position: absolute;
		bottom: 15px;
		left: 50%;
		width: 120px;
		margin-left: -60px;
}
.snip .info: hover {
		-webkit-box-shadow: 0 0 5px #000;
		-moz-box-shadow: 0 0 5px #000;
		box-shadow: 0 0 5px #000;
}

/* 小さいリスト場合 */

.col_3_small section .snip .info,
.col_4_small section .snip .info,
.col_5_small section .snip .info,
.project_two .snip .info{
	width: 100px;
	margin-left: -50px;
	font-size: 13px;
	padding: 4px;
}

.col_3_small section .snip h2,
.col_4_small section .snip h2,
.col_5_small section .snip h2,
.project_two .snip h2 {
	margin:5px 0;
	padding: 4px 10px;
	font-size: 16px;
}

.col_3_small section .other_info,
.col_4_small section .other_info,
.col_5_small section .other_info {
	font-size:11px;
}



.snip img ,
.new_snip img{
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.snip .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(0,0,0, 0.7);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.snip h2 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.snip .mask p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.new_snip:hover img,
.seemore:hover .snip img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.snip a.info,
.seemore .info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.seemore:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.seemore:hover .snip h2,
.seemore:hover .snip p,
.seemore:hover .snip .info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.seemore:hover .snip p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.seemore:hover .info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}

/* 説明文 textOverflow */

.textOverflow{
  overflow: hidden;
  width: 100%;
}

.col_1 .gyousya_wrap .inner_right .textOverflow{
	width:350px;
	text-align:right;
	font-size:15px;
}

.col_3 .mask p.textOverflow,
.col_4 .mask p.textOverflow{
	font-size:15px;
	height: 48px;
}

.col_4_small p.textOverflow,
.col_5_small p.textOverflow{
	width:216px;
  height: 40px;
}

.project_one .snip .mask p.textOverflow{
	width:344px;
  height: 60px;
		overflow: hidden;
		font-size:15px
}

figure.new_snip .textOverflow {
  top: 30%;
  padding: 10px 20px 0;
  font-weight: bold;
  -webkit-transform: translate3d(0%, 100%, 0);
  transform: translate3d(0%, 100%, 0);
}

#newest .textOverflow{
	height:60px;
}


/* 赤いリボン */


.ribon_wrap{
	position:absolute;
	top:-6px;
	right:-6px;
}

.ribbon{
color: #fff;
width: 0;
height: 0;
border-style: solid;
border-width: 0 66px 66px 0;
border-color: transparent #dd4c39 transparent transparent;
position: relative;
width: 66px;
}

.ribbon span {
position: relative;
display: inline-block;
right: -12px;
text-align: center;
text-transform: uppercase;
top: 8px;
width: 66px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
letter-spacing: 4px;
font-weight: bold;
}

.ribbon:before {
content: "";
position: absolute;
top: 0;
right: -6px;
z-index: -1;
width: 0;
height: 0;
border-style: solid;
border-width: 6px 0 0 6px;
border-color: transparent transparent transparent #662121;
}

.ribbon:after {
content: "";
position: absolute;
top: 60px;
z-index: -1;
right: -66px;
width: 0;
height: 0;
border-style: solid;
border-width: 6px 0 0 6px;
border-color: transparent transparent transparent #662121;

}

/* checkbox */


.col_3 .gyousya_wrap .title_check input[type="checkbox"]{
  display: none;
}
.col_3 .gyousya_wrap .title_check{
  cursor: pointer;
  position: relative;
}
.col_3 .gyousya_wrap .lever{
width: 200px;
height: 40px;
display: block;
color: #fff;
border-radius: 40px;
margin-right: 10px;
margin-bottom: 10px;
-webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
-moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
-o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
transition: all 300ms cubic-bezier(1, 0, 0, 1);
-webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
-moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
-o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
transition-timing-function: cubic-bezier(1, 0, 0, 1);
position: relative;
font-size: 15px;
text-align: center;
padding-top: 10px;
line-height: 1;
cursor: pointer;
background: #9d9d9d;
border: 2px solid #9d9d9d;
}
.col_3 .gyousya_wrap .lever:before{
  content:'';
  position: absolute;
  left: 6px;
  top:8px;
  /* border: 1px solid #e5e5e5; */
  background: #fff;
  width: 20px;
  height: 20px;
  border-radius:100%;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.col_3 .gyousya_wrap .title_check:hover .lever:before{
   /* border-color: #ddd; */
}
.col_3 .gyousya_wrap .title_check input[type="checkbox"]:checked + .lever{
   background: #fdcf52;
			color:#333;
}
.col_3 .gyousya_wrap .title_check input[type="checkbox"]:checked + .lever{
   border-color:#fdcf52;
}
.col_3 .gyousya_wrap .title_check input[type="checkbox"]:checked + .lever:before{
   left: 100%;
   margin-left: -26px;
   border-color: #fff;
}

.col_3 .gyousya_wrap .lever:hover{
	background:#b3b3b3;
	border-color:#b3b3b3;
}

/* IE ************************/
@media all and (-ms-high-contrast:none) {

.col_3 .gyousya_wrap .lever{
	padding-top: 13px;
}
	
	.snip h2{
		padding: 10px 10px 4px;
	}
	
}

/*
     FILE ARCHIVED ON 22:44:52 Mar 26, 2022 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 10:14:19 Jul 16, 2026.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  captures_list: 1.383
  exclusion.robots: 0.052
  exclusion.robots.policy: 0.044
  esindex: 0.008
  cdx.remote: 15.745
  LoadShardBlock: 314.534 (3)
  PetaboxLoader3.resolve: 151.383 (4)
  PetaboxLoader3.datanode: 129.801 (5)
  load_resource: 361.529
  loaddict: 264.738
*/