@media (max-width:700px){
    .new_quickmenu {display: none;}

    #header .logo img {width: 114px;}

    #visual .main .container {width: 95%;}
    #visual .text h2 {font-size: 2rem;}
    #visual .text h2 span {font-size: 2rem;}
    #visual .text p {font-size: 1.1rem;}

    #solution .mo_text {gap:40px 20px;} 
    #solution .mo_text .box .title {font-size: 1.2rem;}
    #solution .mo_text .box .text {font-size: 0.9rem;}

    #application img {width: 100%; max-width: 340px;}
    #application a {width: 20%;}
    #application a.video_1 {top: 14.8%; left: 59%;}
    #application a.video_2-1 {left: 33.4%; top: 33.5%;}
    #application a.video_2-2 {top: 65.9%; right: 32.3%;}
    #application a.video_3 {bottom: 46.1%; right: 46.8%;}
    #application a.video_4-1 {bottom: 1.1%; right: 51.4%;}
    #application a.video_4-2 {bottom: 14.2%; right: 27.9%;}
}
@media (max-width:600px){
    #package{padding:60px 0;}
    #package .inner{padding:0 16px;}
    #package .main_service{padding:26px 16px; border-radius:18px;}
    #package .main_service::before{padding:2px;}
    #package .main_service .title{font-size:1.05rem; line-height:1.3;}
    #package .main_service .text{font-size:0.9rem; line-height:1.5; padding:0;}

    #package .add_service .box_wrap{padding:14px; border-radius:22px; gap:12px;}
    #package .add_service .box_wrap .box{padding:18px 16px; border-radius:18px;}
    #package .add_service .box_wrap .box .left img{width:52px;}
    #package .add_service .box_wrap .box .right .title{font-size:1rem;}
    #package .add_service .box_wrap .box .right .text{font-size:0.9rem;}
}


@media (max-width:500px){
    .sub_title h3 {font-size: 1.3rem;}
    .mo_txt {display: block;}
    .pc_txt {display: none;}

    #fixed_header .inner { padding:14px 16px; }
    #fixed_header .logo img { width:96px; }
    #fixed_header .menu ul { display:none; }
    #fixed_header .menu .inqu {   padding:6px 12px;   font-size:0.8rem; }
    
    #header {padding: 0;}
    #header nav {display: none;}
    
    #visual .main .container {padding: 40px 7vw 80px 7vw; background: url(../image/visual_back.png) 50% 50%;}
    #visual .text {margin: 90px 0 70px 0;}
    #visual .text h2 {font-size: 1.4rem;}
    #visual .text h2 span {font-size: 1.4rem;}
    #visual .text p {font-size: 0.9rem;}
    #visual .btn_wrap {flex-direction: column-reverse; gap: 20px;}
    #visual .btn_wrap a {width: max-content;}

    #solution {padding: 60px 20px;}
    #solution .inner {border-radius: 20px;}
    #solution .sub_title {top: 50%; left: 50%; transform: translate(-50%, -50%)}
    #solution .sub_title p {margin: 0 0 10px 0; font-size: 0.9rem;}
    #solution .sub_title h3 {font-size: 1rem;}
    #solution .mo_text .box .title {padding: 0 10px 10px 10px; margin: 0 0 10px 0; font-size: 1rem;}
    #solution .mo_text .box .text {line-height: 1.3;}
    
    #block .container .right p {font-size: 1.1rem;}
    #block p .icon{height: 13px; transform: translateY(0px);}
    #block .con_3 .box {padding: 40px; border-radius: 20px;}
    #block .con_3 .box_1 p {font-size: 1rem; margin: 0;}
    #block .con_3 .box_1 img {width: 80px;}
    #block .container {border-radius: 20px;}
    #block .container .left .phone {width: 48%;}
    #block .con_1 .left .float {width: 55%; left: 32%;}
    #block .con_2 .left .float {width: 63%; bottom: -17%; left: 26%;}
    #block .con_3 .box_2 .right .phone {width: 70%;}
    #block .con_3 .box_2 .right .float {width: 79%; right: 0.5%;}
    #block .con_3 .box_2 .right {margin-top: 0;}
    

    #share .box_wrap {margin: 40px 0 0 0;}
    #share .box_wrap .title {font-size: 1rem;}
    #share .box_wrap .box .image_wrap img {width: 80%;}
    #share .box_wrap .box .name {font-size: 1rem;}

    #footer .top .left a {margin: 0 5px; font-size:0.9rem;}

    #custom {padding: 60px 0;}
    #custom .top .right .title .name {font-size: 1.2rem;}
    #custom .top .right .title .text {font-size: 1rem;}
    #custom .top .right .box_wrap .box .text {font-size: 1rem;}
    #custom .bottom .left .text .title {font-size: 1.2rem;}
    #custom .bottom .left .text .title span {font-size: 1.2rem;}
    #custom .bottom .left .text .text {font-size: 1rem;}
    #custom .bottom .left .box_wrap .box {padding: 38px; border-radius: 20px;}

    #case {padding: 60px 0;}
    #case .box .text {margin: 0 0 20px 0;}
    #case .box .text span {font-size: 1.2rem; margin: 40px 0 10px 0;}
    #case .box .text p {font-size: 1rem;}
    #case .box .image {border-radius: 20px}

    #bk_image {padding: 40px 0}
    #bk_image .inner .box .image img {height: 210px;}
    #bk_image .inner .box .text {padding: 40px 0 0 0;}

    #application {padding: 60px 0;}
    #application h4 {font-size: 1.2rem; margin: 10px 0 0 0;}
    #application a {width: 30%;}
    #application a.video_1 {top: 14.5%; left: 63.8%;}
    #application a.video_2-1 {left: 24.5%; top: 33.1%;}
    #application a.video_2-2 {top: 65.6%; right: 24.3%;}
    #application a.video_4-2 {bottom: 13.8%; right: 17.9%;}
    #application .video_pop .video {width: min(88vw, 1000px);}

    #last {height: 320px;}
    #last .inner .text > p {font-size: 1.1rem;}
    #last .btn_wrap {gap: 10px;}
    #last .btn_wrap a p {font-size: 0.9rem;}
    #last .btn_wrap a {padding: 9px 14px;}
    #last .btn_wrap a img {width: 16px; margin: 0 8px 0 0;}
}

@media (max-width: 360px){
    
    #package .main_service .title{font-size:1rem;}
    #package .add_service .box_wrap .box{padding:16px 14px;}
    #package .add_service .box_wrap .box .left img{width:48px;}
}