.sub_page{width: 100%; height: 100vh; background: #000; text-align: center; position: relative; overflow: hidden;}

.sub_page .abs_center{width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 5;}

.sub_page h3{padding-bottom: 40px;}
.sub_page h4{padding-bottom: 10px;}


.sub_page .to_from{width: 100%; margin-top: 80px; display: flex; align-items: center; justify-content: center;}
.sub_page .to_from img{display: inline-block; margin: 0 50px;}


.sub_page .l_float_img{position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 30%; z-index: 1;}
.sub_page .r_float_img{position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 30%; z-index: 1;}
.sub_page .l_float_img img,
.sub_page .r_float_img img{max-width: 100%;}

.sub_page .r_float_img img:nth-child(1){float: right;}
.sub_page .r_float_img img:nth-child(2){position: absolute; right: 20%; bottom: 50px; max-width: 40%;}



.sub_page.thank .l_float_img img:nth-child(2){position: absolute; bottom: 0; left: 30%; max-width: 80%;}

.sub_page.oops .l_float_img img:nth-child(2){position: absolute; top: 0; left: 30%; max-width: 45%;}
.sub_page.oops .l_float_img img:nth-child(3){position: absolute; bottom: 0; left: 12%; max-width: 50%;}


.sub_page.thank .inner,
.sub_page.oops .inner{height: 100%; z-index: 2;}


#link_button{width: 100%; margin-top: 30px;}
#link_button a{width: 750px; height: 75px; max-width: 95%; margin: 0 auto; background: #1edc1f; display: flex; align-items: center; justify-content: space-around; border-radius: 50px; box-shadow: inset 2px 5px 5px #00000059; border: 5px solid #fff; box-sizing: border-box;}
#link_button a:hover span:nth-child(1){animation: arrow_right 2s ease-in-out;}
#link_button a:hover span:nth-child(3){animation: arrow_left 2s ease-in-out;}

@keyframes arrow_right{
    0%{transform: translateX(0);}
    20%{transform: translateX(0);}
    40%{transform: translateX(10px);}
    60%{transform: translateX(0);}
    80%{transform: translateX(10px);}
    100%{transform: translateX(0);}
}
@keyframes arrow_left{
    0%{transform: translateX(0);}
    20%{transform: translateX(0);}
    40%{transform: translateX(-10px);}
    60%{transform: translateX(0);}
    80%{transform: translateX(-10px);}
    100%{transform: translateX(0);}
}




@media screen and (max-width : 1000px) {
    .sub_page{height: auto; padding: 350px 0 350px; }
    .sub_page .abs_center{position: relative; top: 0; left: 0; transform: translate(0);}

    .sub_page .l_float_img{top: 20%;}
    .sub_page .r_float_img{top: 80%;}

    .sub_page h3{padding-bottom: 20px;}
    .sub_page h4{padding-bottom: 5px;}
    .sub_page .to_from{margin-top: 40px;}
    .sub_page .to_from img{margin: 0 30px; width: 35px;}

    #link_button a{height: 55px; border: 3px solid #fff;}
}
@media screen and (max-width : 768px){
    .sub_page .to_from span{font-size: 17px !important;}
    .sub_page .to_from img{margin: 0 15px; width: 25px;}

    #link_button a{font-size: 15px;}
    #link_button a span{font-size: 13px;}
}
@media screen and (max-width : 550px){
    .sub_page .l_float_img{top: 20%; width: 45%;}
    .sub_page .r_float_img{top: 80%; width: 45%;}

    .sub_page .to_from span{font-size: 15px !important;}
    .sub_page .to_from img{margin: 0 15px; width: 25px;}

    #link_button a{max-width: 96%; font-size: 16px !important;}
}