html{
	font-size: 20px;
}


.ruika_green{

font-family: ruika, sans-serif;
font-style: normal;
font-weight: 100;
color: #0a887e;

}


.ruika_white{

font-family: ruika, sans-serif;
font-style: normal;
font-weight: 100;
color: #ffffff;/*#1D1B1B*/

}



.card2 {
    position:relative;
}
 
.card2::before {
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        content:"";
        background:
            linear-gradient(to right, #0091ff, #0091ff, rgba(0, 145, 255, 0)) 200% 0 / 200% 5px no-repeat,
            linear-gradient(to bottom, #0091ff, #0091ff, rgba(0, 145, 255, 0)) 100% 200% / 5px 200% no-repeat,
            linear-gradient(to left, #0091ff, #0091ff, rgba(0, 145, 255, 0)) -200% 100% / 200% 5px no-repeat,
            linear-gradient(to top, #0091ff, #0091ff, rgba(0, 145, 255, 0)) 0 -200% / 5px 200% no-repeat;
        transition:background-position 0.4s;
    }
 
    .card2:hover::before {
        background-position:0 0, 100% 0, 100% 100%, 0 100%;
    }


a:hover{
    text-decoration: none;
}
a{
    color: black;
	z-index: 100;
}

	 .survey-button {
	  background-color: #ff5722;
	  color: white;
	  border-radius: 5px;
		 padding: 5px;
	  font-size: 1rem;
	  text-decoration: none;
	  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
	  z-index: 1000;
	  transition: background-color 0.3s;
	  text-align: center;
	}

	.survey-button:hover {
	  background-color: #e64a19;
	}
	  



/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}