.article_header .head_inner .inner_nav .dropDown .submenu { right: -50px; transform: translateX(-30px); left: unset; }

h5 { margin-bottom: 1.5rem; }

section { display: flex; flex-direction: column; justify-content: center; background: #ffffff; color: #000000; }
section .container a { color: #000000; }
section .container .tabnav { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; }
section .container .tabnav li { margin-right: 2rem; }
section .container .tabnav li a { position: relative; display: block; padding: 0 2rem; height: 45px; line-height: 45px; border-radius: 50rem; font-size: 1.6rem; font-weight: 600; background: #f5f5f5; letter-spacing: 0; }
section .container .tabnav li:hover a { color: #ffffff; background: #354cda; transition: 0.3s; }
section .container .tabnav li a.active { color: #ffffff; background: #354cda; }




/* 공통 */
section .container .component_wrap .component_inner { position: relative; }
section .container .component_wrap .component_inner .component_content { display: flex; justify-content: space-between; }
section .container .component_wrap .component_inner .component_content .content_title { flex: 0 0 25%; }
section .container .component_wrap .component_inner .component_content .content_desc { flex: 0 0 75%; }




/* 도입부분 */
.intro { padding: 0; justify-content: flex-start; background: #ffffff; }
.video_mo { display: none; }
.main { width: 100vw; height: 100vh; background:#ffffff; overflow: hidden; }
.main .cont { position: relative; height: 100%; }
.main_tit01 h1,
.main_tit02 h1 { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); line-height: 1; transition: color 0.3s; -webkit-text-stroke: 1px #ffffff; text-align: center; }
.main_tit01 h1 { width: 100%; mix-blend-mode: screen; z-index: 3; }
.main_tit02 h1 { width: 100%; z-index: 1; color:#141150; }

.photozone { position: absolute; width: 50vw; height: 50vh; left: 50%; top: 50%; transform: translate(-50%,-50%); background:#ffffff; background-size: 100vw; transition: 0.5s; overflow: hidden; z-index: 2; }
.photozone.on { opacity: 0.9; transition: all 1s; }
.photozone.on::after { content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.photozone video { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: inherit; }




/* 서비스 개요 */
.summary { min-height: 350px; }
.summary .container .component_wrap .component_inner .component_content { display: block; }
.summary .container .component_wrap .component_inner .component_content .txt { margin-bottom: 10rem; text-align: center; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap { position: relative; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap { position: relative; left: -600px; display: flex; justify-content: space-between; align-items: center; width: 3000px; min-height: 400px; height: 400px; margin: auto; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap li { position: absolute; width: 600px; height: 100%; padding: 0 3rem; overflow: hidden; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap li img { width: 100%; height: 100%; border-radius: 2rem; object-fit: cover; overflow: hidden; }
/* 
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .marquee_flex { display: flex; width: 3000px; position: absolute; overflow: hidden; white-space: nowrap; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .marquee_flex .flex_content { position: relative; margin: 0; padding-left: 100%; display: inline-block; width: 600px; height: 400px; padding: 4rem; border-radius: 1rem; white-space: nowrap; overflow: hidden; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .marquee_flex .flex_content::after { position: absolute; content: ""; top: 0;left: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: rgba(37,35,25,0.1); z-index: -1; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .marquee_flex .flex_content .inner { position: absolute; content: ''; bottom: 4rem; left: 4rem; color: #ffffff; z-index: 1; }
.summary .container .component_wrap .component_inner .component_content .marquee_wrap .marquee_flex .flex_content .inner h5 { margin-bottom: 0; } 수정해야 될 수 있음*/




/* 서비스 특장점 */
.benefit { background: #f9f9f9; }
.benefit .container .component_wrap .component_inner .component_content { display: block; }
.benefit .container .component_wrap .component_inner .component_content ul { display: flex; justify-content: space-between; gap: 6rem; }
.benefit .container .component_wrap .component_inner .component_content ul li { display: block; flex: 1; background: #ffffff; border-radius: 2rem; border: 1px solid #f5f5f5; box-sizing: border-box; box-shadow: 4px 12px 40px 6px rgba(0,0,0,.09); overflow: hidden; }
.benefit .container .component_wrap .component_inner .component_content ul li .icon { display: table; vertical-align: middle; width: 100%; height: 220px; margin: 0 auto; background: #354cda; text-align: center; }
.benefit .container .component_wrap .component_inner .component_content ul li .icon span { display: table-cell; position: relative; }
.benefit .container .component_wrap .component_inner .component_content ul li .icon span::after { position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 120px; height: 120px; }
.benefit .container .component_wrap .component_inner .component_content ul li:nth-child(1) .icon span::after { background: url(../images/tappay/ic_benefit_01.png) no-repeat center; background-size: contain; }
.benefit .container .component_wrap .component_inner .component_content ul li:nth-child(2) .icon span::after { background: url(../images/tappay/ic_benefit_02.png) no-repeat center; background-size: contain; }
.benefit .container .component_wrap .component_inner .component_content ul li:nth-child(3) .icon span::after { background: url(../images/tappay/ic_benefit_03.png) no-repeat center; background-size: contain; }
.benefit .container .component_wrap .component_inner .component_content ul li .cont_txt { padding: 4rem; text-align: center; }




/* 서비스 컨셉 */
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul { display: flex; justify-content: space-between; flex-wrap: nowrap; gap: 6rem; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li { position: relative; flex: 1; display: block; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo { position: relative; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .customer { margin-top: 2rem; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .customer p { font-weight: 700; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img { position: relative; display: block; width: 100%; height: 300px; border-radius: 2rem; overflow: hidden; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img.tv { background: url(../images/tappay/img_concept_01.png) no-repeat left; background-size: cover; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img.restaurant { background: url(../images/tappay/img_concept_04.png) no-repeat center; background-size: cover; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img.individual { background: url(../images/tappay/img_concept_02.png) no-repeat top; background-size: cover; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img.individual .temp_overlay { position: absolute; content: ''; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img.individual .temp_txt { position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight: 700; color: #ffffff; z-index: 1; }
.concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .usecase { margin-top: 2rem; }
.concept .container .component_wrap .component_inner .component_content .content_desc .options { display: flex; flex-direction: row; align-items: stretch; overflow: hidden; min-width: 600px; max-width: 100%; height: 600px; }




/* 서비스 대상 */
.target { background: #f9f9f9; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap { display: flex; justify-content: space-between; gap: 6rem; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li { position: relative; width: 100%; overflow: hidden; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .feature_img { width: 100%; height: 300px; border-radius: 2rem; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li:nth-child(1) .feature_img { background: url(../images/tappay/img_target_01.png) no-repeat center; background-size: cover; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li:nth-child(2) .feature_img { background: url(../images/tappay/img_target_03.png) no-repeat center; background-size: cover; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .label { display: inline-block; width: fit-content; padding: .5rem 1.5rem; border: 1px solid rgba(255,255,255,.5); border-radius: 10rem; font-size: 1.6rem; font-weight: 700; color: #ffffff; letter-spacing: 0; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .text { margin-top: 2rem; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .text h5 { letter-spacing: 0; }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .contact_btn { display: flex; align-items: center; gap: 1rem; margin-top: 4rem; color: #666666; } 
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .contact_btn .point_circle { position: relative; width: 3rem; height: 3rem; background: #eeeeee; border-radius: 50%; overflow: hidden; } 
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .contact_btn .point_circle .uil_icon { display: block; position: relative; font-size: 1.8rem; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .contact_btn:hover .point_circle { background: #354cda; transition: 0.3s; } 
.target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .contact_btn:hover .point_circle .uil_icon { color: #ffffff; } 




/* 서비스 플로우 */
.flow { position: relative; }
.flow .container .component_wrap .component_inner .component_content .content_desc { width: 100%; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper { width: 100%; height: 100%; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-pointer-events { touch-action: pan-y; }
.swiper-wrapper { width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-android .swiper-slide,
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper { transform: translate3d(0px,0,0); }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide { position: relative; width: 100%; height: 100%; border-radius: 2rem; text-align: center; transition-property: transform; flex-shrink: 0; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide::before { position: absolute; content: ''; top: 50%; right: -10px; transform: translateY(-50%); width: 100px; height: 70px; background: linear-gradient(90deg, #ffffff, #eeeeee); z-index: -1; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide::after { position: absolute;content: ''; top: 50%; right: -100px; transform: translateY(-50%); width: 0; height: 0; border-bottom: 45px solid transparent; border-top: 45px solid transparent; border-left: 45px solid #eeeeee; border-right: 45px solid transparent; z-index: -1; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide:last-child::before,
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide:last-child::after { display: none; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img { width: 100%; height: 600px; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img.img01 { background: url(../images/tappay/img_flow_01.png) no-repeat center; background-size: contain; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img.img02 { background: url(../images/tappay/img_flow_02.png) no-repeat center; background-size: contain; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img.img03 { position: relative; background: url(../images/tappay/img_flow_03.png) no-repeat center; background-size: contain; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img.img03::after { position: absolute; content: ''; top: 285px; left: 50%; transform: translateX(-50%); background: url(../images/tappay/img_flow_09.gif) no-repeat center; background-size: contain; width: 180px; height: 180px; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img.img04 { background: url(../images/tappay/img_flow_04.png) no-repeat center; background-size: contain; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_img.img05 { background: url(../images/tappay/img_flow_05.png) no-repeat center; background-size: contain; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_inner { margin-top: 3rem; }
.flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_inner .label { margin-bottom: 1rem; }

.swiper_operate { display: flex; position: absolute; top: 10%; left: 0; }
.swiper_operate .swiper-button_wrap .swiper-button-next, 
.swiper_operate .swiper-button_wrap .swiper-button-prev { float: right; display: flex; justify-content: center; align-items: center; width: 5rem; height: 5rem; background-color: #d7dbdc; border-radius: 100rem; cursor: pointer; }
.swiper_operate .swiper-button_wrap .swiper-button-prev span,
.swiper_operate .swiper-button_wrap .swiper-button-next span { display: inline-block; width: 11px; height: 11px; border: solid; border-width: 2px 0 0 2px; border-color: #888888; transform: rotate(135deg); }
.swiper_operate .swiper-button_wrap .swiper-button-next:hover, 
.swiper_operate .swiper-button_wrap .swiper-button-prev:hover { background-color: #c7cbcc; transition: .3s ease; }
.swiper_operate .swiper-button_wrap .swiper-button-next:hover span, 
.swiper_operate .swiper-button_wrap .swiper-button-prev:hover span { border-color: #333333; }
.swiper_operate .swiper-button_wrap .swiper-button-prev, 
.swiper_operate .swiper-button_wrap .swiper-container-rtl .swiper-button-next { float: left; margin-right: 1rem; transform: rotateY(180deg); }
.swiper_operate .swiper-button_wrap .swiper-button-prev.swiper-button-disabled, 
.swiper_operate .swiper-button_wrap .swiper-button-next.swiper-button-disabled { opacity: .3; }
.swiper_operate .swiper-pagination { display: flex; align-items: center; gap: 1rem; margin-left: 3rem; }
.swiper_operate .swiper-pagination .swiper-pagination-current,
.swiper_operate .swiper-pagination .swiper-pagination-total { width: 8px; font-size: 1.8rem; font-weight: 700; }




/* 도입효과 */
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap { margin-bottom: 10rem; padding-bottom: 10rem; border-bottom: 1px solid #eeeeee; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list { display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 8rem; grid-row-gap: 8rem; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon { display: none; width: 60px; height: 60px; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon.icon_01 { background: url(../images/tappay/ic_effect_01.png) no-repeat center; background-size: contain; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon.icon_02 { background: url(../images/tappay/ic_effect_02.png) no-repeat center; background-size: contain; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon.icon_03 { background: url(../images/tappay/ic_effect_03.png) no-repeat center; background-size: contain; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon.icon_04 { background: url(../images/tappay/ic_effect_04.png) no-repeat center; background-size: contain; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon.icon_05 { background: url(../images/tappay/ic_effect_05.png) no-repeat center; background-size: contain; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .icon.icon_06 { background: url(../images/tappay/ic_effect_06.png) no-repeat center; background-size: contain; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list li .text .label { display: inline-block; padding: 0.5rem 1rem; margin-top: 1rem; background-color: #eeeeee; border-radius: 0.5rem; font-size: 1.4rem; font-weight: 600; color: #999999; }

.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content { margin-bottom: 6rem; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content h4 { margin-bottom: 2rem; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content .mid_banner { width: 100%; height: 450px; margin-top: 6rem; border-radius: 2rem; background: url(../images/tappay/img_midbg.png) no-repeat center; background-size: cover; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content .mid_banner.company { background: url(../images/tappay/img_midbg.png) no-repeat center; background-size: cover; }
.effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content .mid_banner.customer { background: url(../images/tappay/img_midbg_customer.png) no-repeat center; background-size: cover; }




/* 서비스 소개서 */
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box { display: flex; width: 100%; justify-content: space-between; align-items: center; padding: 4rem; border-radius: 2rem; background: #ffffff; box-shadow: 4px 12px 40px 6px rgba(0,0,0,.09); font-size: 1.8rem; }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box h5 { margin-bottom: 1rem; font-size: 2rem; }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box p { color: #333333; }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap a.mo { display: none; }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap a.pc { display: flex; justify-content: center; align-items: center; width: 6rem; height: 6rem; background-color: #eeeeee; border-radius: 50rem; cursor: pointer; }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap a.pc:hover { background-color: #dddddd; transition: .3s; }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap a.pc span { position: relative; display: inline-block; width: 12px; height: 12px; border: solid; border-width: 2px 0 0 2px; transform: rotate(90deg) translate(0px, -1px); }
.introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap a.pc span::before { position: absolute; top: 4px; left: -4px; content: ''; width: 18px; height: 2px; background: #000000; transform: rotate(45deg); border-radius: 10rem; }




/* ------------ 문의하기 ------------ */
.contact { position: relative; background-color: #daedfd; }
.contact::before { position: absolute; content: ''; top: 0; right: 0; width: 100%; height: 100%; background: url(../images/tappay/img_contactsub.png) no-repeat center; background-size: contain; background-attachment: fixed; }
.contact .container .component_wrap .component_inner { padding: 0; }
.contact .container .component_wrap .component_inner .inner_cont { display: flex; justify-content: space-between; align-items: center; }
.contact .container .component_wrap .component_inner .inner_cont a { display: inline-block; height: 60px; line-height: 60px; padding: 0 4rem; background: #222222; border-radius: 10rem; color: #ffffff; font-size: 1.8rem; font-weight: 600; text-align: center; }
.contact .container .component_wrap .component_inner .inner_cont a i { display: inline-block; font-size: 2rem; }
.contact .container .component_wrap .component_inner .inner_cont a:hover i { transform: translate3d(5px, -5px, 0px); transition: all .3s; }




/* ============================ media queries ============================ */
@media (max-width: 1920px){
}

@media (max-width: 1700px){
}

@media (max-width: 1500px){
}

@media (max-width: 1200px){
    .summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap { left: -400px; width: 2000px; min-height: 250px; height: 250px; }
    .summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap li { width: 400px; }

    .benefit .container .component_wrap .component_inner .component_content ul { display: block; }
    .benefit .container .component_wrap .component_inner .component_content ul li { margin-bottom: 4rem; }
    .benefit .container .component_wrap .component_inner .component_content ul li:last-child { margin-bottom: 0; }
    .benefit .container .component_wrap .component_inner .component_content ul li .icon { height: 200px; }
}

@media (max-width: 991px){
    .flow .container .component_wrap .component_inner .component_content { display: block; }
    .flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide::before,
    .flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide::after { display: none; }
    .flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-android .swiper-slide,
    .flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper { margin-top: 4rem; }

    .contact .container .component_wrap .component_inner .inner_cont { justify-content: flex-start; gap: 4rem; }
}

@media (max-width: 768px){
    section { padding: 20% 7%; }
    section .container .component_wrap .component_inner .component_intro_txt h2 { font-size: 4rem; }
    section .container .component_wrap .component_inner .component_intro_txt p br { display: none; }
    section .container .component_wrap .component_inner .component_content { display: block; }

    .video_pc { display: none; }
    .video_mo { display: block; }
    .video_mo .cont .main_tit { position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #ffffff; text-align: center; }
    .video_mo .cont .main_tit h2 { line-height: 1.2; }
    .video_mo .cont .photozonemo video { width: 100vw; }

    .intro .container .component_wrap .component_inner .component_content .zoom_wrap { width: 300px; left: 50%; transform: translateX(-50%); }
    .intro .container .component_wrap .component_inner .component_content .zoom_wrap .zoomin .video_container { left: 50%; transform: translateX(-50%); }
}

@media (max-width: 683px){
    h3 { font-size: 3rem; }
    h3 br { display: none; }

    .section-title { font-size: 6rem; }
    .section-title br { display: block; }
    .section-title span { line-height: 1.3; }
    section .container .component_wrap .component_inner .component_content .content_title { margin-bottom: 6rem; }

    .summary .container .component_wrap .component_inner .component_content .marquee_wrap .marquee_flex .flex_content { width: 350px; height: 250px; }

    .concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul { display: block; }
    .concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li { margin-bottom: 6rem; }
    .concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li:last-child { margin-bottom: 0; }
    .concept .container .component_wrap .component_inner .component_content .content_desc .item_wrap ul li .userinfo .img { height: 250px; }

    .target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap { display: block; }
    .target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li { margin-bottom: 6rem; }
    .target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li:last-child { margin-bottom: 0; }
    .target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .text p br { display: none; }
    .target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .feature_img { height: 230px; }
    .target .container .component_wrap .component_inner .component_content .content_desc .feature_wrap li .contact_btn { margin-top: 2rem; }

    .swiper_wrap { position: relative; }
    .swiper { overflow-y: visible; height: 100%; margin: 0; }
    .swiper-wrapper { overflow: visible; padding: 0; }
    .swiper-wrapper .swiper-slide { display: block; width: 100% !important; height: 100%; overflow: visible; padding: 0; background: transparent; transform: rotate(180deg); }
    .swiper-wrapper .swiper-slide::before { display: none; }
    .swiper-wrapper .swiper-slide:hover::before { display: none; }
    .swiper-wrapper .swiper-slide .item_img { position: static; top: auto; left: auto; width: 100%; height: 500px; transform: rotate(180deg); }
    .swiper-wrapper .swiper-slide .item_inner { display: block; height: auto; padding: 0; margin: 4rem 0 6rem 0; text-align: center; transform: rotate(180deg); }
    .swiper_operate { width: 100%; height: 1rem; top: 0; left: 0; bottom: 0; justify-content: center; }
    .swiper_operate .swiper-button_wrap { display: none; }
    .swiper_operate .swiper-pagination { margin-left: 0; gap: 1.5rem; }
    .swiper_operate .swiper-pagination .swiper-pagination-bullet { width: 1rem; height: 1rem; border-radius: 100%; background: #cccccc; }
    .swiper_operate .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #354cda; }
    
    .effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content { margin-bottom: 4rem; }
    .effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .mid_content .mid_banner { height: 230px; margin-top: 4rem; }
    .effect .container .component_wrap .component_inner .component_content .content_desc .list_wrap .effect_list { grid-template-columns: 1fr; grid-row-gap: 6rem; }

    .introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box { display: block; padding: 4rem; margin-bottom: 2rem; }
    .introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box:last-child { margin-bottom: 0; }
    .introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box .text { text-align: center; }
    .introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box a.pc { display: none; }
    .introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box a.mo { display: block; width: 100%; height: 5rem; line-height: 5rem; margin-top: 2rem; text-align: center; background: #3f4750; border-radius: 50rem; font-weight: 600; color: #ffffff; }
    .introduction .container .component_wrap .component_inner .component_content .content_desc .list_wrap .download_box a.mo:hover { background-color: #222222; transition: .3s; }

    .flow .container .component_wrap .component_inner .component_content .content_desc .swiper_wrap .swiper .swiper-wrapper .swiper-slide .item_inner .desc { min-height: 50px; }

    .contact { padding: 15% 7%; }
    .contact .container .component_wrap .component_inner .inner_cont { display: block; text-align: center; }
    .contact .container .component_wrap .component_inner .inner_cont h3 { margin-bottom: 2rem; }
}

@media (max-width: 450px){
    .summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap { left: -200px; width: 1000px; min-height: 200px; height: 200px; }
    .summary .container .component_wrap .component_inner .component_content .marquee_wrap .rolling_wrap li { width: 300px; padding: 0 1rem; }
}

@media (max-width: 376px){
}