@charset "UTF-8";

.cp_bnr a {
	display: inline-block;
	border: 1px solid var(--lineColor);
	border-radius: 10px;
	box-shadow: 4px 4px 0px rgba(15, 19, 80, .07);
	transition: all .2s ease;
	position: relative;
	overflow: hidden;
}

@media screen and (min-width: 1025px) {
    .cp_bnr a:hover {
        border-color:var(--Main1);
        color: var(--Main1);
        box-shadow: none;
        transform: translateX(4px) translateY(4px)
    }
}

.cp_bnr a::after {
    position: absolute;
    bottom: 6px;
    right: 6px;
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background: var(--Main1);
    border-radius: 100%;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%227%22%20height%3D%2212%22%20viewBox%3D%220%200%207%2012%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0.80026%2011.1339L5.93359%206.00052L0.80026%200.867187%22%20stroke%3D%22white%22%2F%3E%3C%2Fsvg%3E");
    background-size: 7px 12px;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0
}

.cp_bnr a:hover::after {
    animation: left-in-then-outBg .4s cubic-bezier(0.76, 0, 0.24, 1) forwards
}

.cp .mfp-iframe-holder .mfp-content {
	max-width: 1120px;
}

.cp .mfp-iframe-scaler iframe {
	background: #fff;
}

@media screen and (max-width: 767.9px) {
    .cp .mfp-iframe-scaler {
        padding-top: 80dvh;
    }
}