.visual {display: flex; align-items: center; justify-content: center; width: 100%; height: calc(100vh - 86px); /*margin-top: 86px;*/ margin-top: 0 !important; background: var(--gray_ea);}
.visual .d-flex {display: flex; align-items: center; justify-content: center; gap: 100px;}
.visual .d-flex .phone_talk {position: relative; width: 340px; height: auto; overflow: hidden;}
.visual .d-flex .phone_talk .phone_img {position: relative; width: 100%; height: auto; aspect-ratio: 340/690; border-radius: 40px; background: var(--wt);}
.visual .d-flex .phone_talk .phone_img:before {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; display: block; width: calc(100% - 24px); height: calc(100% - 24px); background: #CBD9F9; border-radius: 30px;}
.visual .d-flex .phone_talk .phone_img:after {position: absolute; top: 0; left: 50%; transform: translateX(-50%); content: ''; display: block; width: 160px; height: auto; aspect-ratio: 160/40; background: url(./../img/phone_s.png)no-repeat 50% 50%; background-size: cover; z-index: 6;}
/* .visual .d-flex .phone_talk .phone_img img {width: 100%; height: auto;} */

.visual .d-flex .phone_talk .talk_img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; flex-flow: column; justify-content: flex-end; width: calc(100% - 24px); height: calc(100% - 24px); text-align: center; overflow: hidden;}
.visual .d-flex .phone_talk .talk_img img {width: 260px; height: auto; margin: 0 auto 0; object-fit: contain;}
.visual .d-flex .phone_talk .talk_img img:not(:first-of-type) {height: 0;}

.visual .d-flex .phone_talk .talk_img img {opacity: 0; transform: translateY(20px); transition: all 0.5s ease; display: block;}
.visual .d-flex .phone_talk .talk_img img:first-of-type {margin-top: 0;}
.visual .d-flex .phone_talk .talk_img img.on {animation: talk 1s linear both; display: block; margin-top: 40px;}
@keyframes talk {
  0% {opacity: 0; height: 0;}
  100% {opacity: 1; height: 336px;}
}

.visual .d-flex .phone_talk .talk_img img:last-of-type {margin-bottom: 0;}

.visual .d-flex .txt-box {text-align: left;}
.visual .d-flex .txt-box .tit {font-size: 54px; font-weight: bold; line-height: 1.4; color: var(--black_1);}
.visual .d-flex .txt-box .tit span {color: var(--pr);}
.visual .d-flex .txt-box .hash_tag {display: flex; align-items: center; gap: 20px; margin-top: 30px;}
.visual .d-flex .txt-box .hash_tag div {font-size: 16px; font-weight: 500; line-height: 1.4; color: var(--black_1);}
.visual .d-flex .txt-box .hash_tag div span {color: var(--pr2);}
.visual .d-flex .txt-box .kv_btn {display: flex; align-items: center; justify-content: center; background: var(--pr); border-radius: 15px; width: 365px; height: 60px; aspect-ratio: 365/60; margin-top: 30px; font-size: 18px; font-weight: bold; line-height: 1; color: var(--wt);}

.visual .more_btn {position: fixed; bottom: 20px; left: 50%; transform: translate(-50%, -50%); max-width: 1320px; width: 100%; z-index: 5;}
.visual .more_btn.off {animation: flip-out-ver-left 0.45s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;}
@keyframes flip-out-ver-left {
  0% {
    -webkit-transform: translate(-50%, -50%) rotateY(0);
            transform: translate(-50%, -50%) rotateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotateY(-70deg);
            transform: translate(-50%, -50%) rotateY(-70deg);
    opacity: 0;
  }
}
.visual .more_btn .link_btn {display: flex; align-items: center; justify-content: center; width: 100%; height: 60px; background: var(--pr2); font-size: 18px; font-weight: bold; line-height: 1; color: var(--black_1); border-radius: 15px;}
.visual .more_btn .btn_bubble_img {position: absolute; top: -56px; left: 50%; transform: translateX(-50%); width: auto; height: 46px;}
.visual .more_btn .btn_bubble_img img {position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: auto; height: 100%; opacity: 0; transition: all .3s;}
.visual .more_btn .btn_bubble_img img.active {animation: bounce-in-fwd 1.1s both; opacity: 1;}