.contents-deco {
position: absolute;
top: 0;
right: 2%;
width: 60%;
height: calc(100% - 30px);
}
.contents-deco::before {
background: url('data:image/svg+xml;charset=UTF-8,') no-repeat top right / contain;
content: '';
display: block;
margin: auto;
opacity: .03;
position: sticky;
top: 80px;
width: 100%;
height: calc(100svh - 100px);
}
/*====================================================
////id | intro_title
====================================================*/
.intro_title-head {
background: linear-gradient(to right, #4EACF4, #68DA7C);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-size: min(6.5vw, 6rem);
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
}
/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
}
@media (hover: hover) {}
/*====================================================
////id | message
====================================================*/
.message-item-wrapper {
display: grid;
grid-gap: min(7vw, 40px);
}
.message-item {
background: rgba(219, 249, 219, .2);
display: grid;
place-items: center;
padding: min(5vw, 60px) min(4vw, 40px);
}
.message-head {
font-size: min(6vw, 3.5rem);
}
.message-item-head {
font-size: min(5vw, 3rem);
}
.message-item.item-2 .checkMark li::before {
filter: grayscale(100);
}
.message-item.item-3 .checkMark {
font-size: 1.1em;
}
.message-item.item-3 .checkMark li::before {
background: url('data:image/svg+xml;charset=UTF-8,') no-repeat top left ;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
}
/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
.message-item {
text-align: center;
}
}
@media print, screen and (min-width: 960px) {
}
@media (hover: hover) {}