header{width: 100%; position: relative;}

.mainNav{width: 100%; margin-top: 30px; padding: 0 40px; display: flex; justify-content: space-between; position: absolute; left: 0; top: 0;}
.subNav{width: 100%; margin-top: 30px; padding: 0 40px 20px; display: flex; justify-content: space-between; position: absolute; left: 0; top: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.menu_btn{padding:0 10px; cursor: pointer;}
.menu_btn .nav-icon{width: 55px; height: 70px; cursor: pointer; background: url(../images/bg-nav-icon.png) no-repeat; padding-top: 43%;}
.menu_btn .nav-icon:before,.menu_btn .nav-icon:after,.menu_btn .nav-icon div{content: ''; display: block; background-repeat: no-repeat; background-position: center right; transform: translateX(0); -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; width: 50%;  height: 2px;  background-color: #fff;  margin: 0 auto; margin-bottom: 15%;}
.menu_btn .nav-icon2{width: 55px; padding-top: 22px;}
.menu_btn .nav-icon2 div,.menu_btn .nav-icon2:before,.menu_btn .nav-icon2:after{content: ''; display: block; width: 50%;  height: 2px;  background-color: #3450A3;  margin: 0 auto; margin-bottom: 10%;}
.menu_btn .nav-icon3{width: 55px; height: 70px; cursor: pointer; background: url(../images/bg-nav-icon2.png) no-repeat; padding-top: 43%;}
.menu_btn .nav-icon3:before,.menu_btn .nav-icon3:after,.menu_btn .nav-icon3 div{content: ''; display: block; background-repeat: no-repeat; background-position: center right; transform: translateX(0); -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; width: 50%;  height: 2px;  background-color: #fff;  margin: 0 auto; margin-bottom: 15%;}

.scrollNav{width:100%;  height:60px;  line-height:60px; position:absolute;  left:0;  top:0;  padding: 0 30px; background-color:#fff; color:#1C4282; font-size: 20px; font-weight: 900; letter-spacing: 5px; display: flex; justify-content: space-between; box-shadow: 0 3px 45px rgb(0 0 0 / 15%); z-index: 99;}

.close_btn{position: absolute; right: 50px; top: 50px; cursor: pointer; width: 40px;}
.close_btn img{width: 100%;}

.fullscreen_menu{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/bg_fullscreen.png) no-repeat; background-color: #3450A3; background-size: 100%; overflow: hidden; z-index: 9999999;}

.fullscreen_menu > img:first-of-type{height: 101px; position: absolute; top: 50px; left: 60px;}
.menu_wrap{position: absolute; width: 50%; padding-left: 5%; right: 0; top: 100px;}
.menu_wrap li{font-size: 58px; font-weight: 600; font-family: 'Chakra Petch', sans-serif; color: #fff; padding-bottom: 50px;}
.menu_wrap li a{text-decoration: none;}

.menu_wrap2{position: absolute; width: 50%; padding-right: 5%; left: 0; bottom: 40px; text-align: right;}
.menu_wrap2 ul{padding-top: 120px; text-align: right;}
.menu_wrap2 ul li{color: #fff; text-decoration: none; display: flex; flex-direction: column; align-items: flex-end;}
.menu_wrap2_contact{position: relative; padding-bottom: 40px;}
.menu_wrap2_contact a p{font-size: 46px; font-weight: 700; line-height: 120%; font-family: 'Play', sans-serif;}
.menu_wrap2_contact a span{font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; font-size: 24px; font-weight: 500; display: block;}
.menu_wrap2_contact span.bd_b50{background-color: #fff; width: 50px; height: 1px; display: block; float: right; margin-top: 20px;}
.menu_wrap2_contact > p:first-of-type{color: #fff; font-weight: 300; font-size: 18px; line-height: 180%; letter-spacing: 1px; padding-top: 30px;}
.menu_wrap2_contact > p:nth-of-type(2){font-size: 18px;}

.menu_wrap2_map p:first-of-type span{font-size: 46px; font-weight: 700; font-family: 'Play', sans-serif; vertical-align: top;}
.menu_wrap2_map p:nth-of-type(2){padding-top: 15px; font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; font-size: 24px; font-weight: 500;}
.menu_wrap2_map p img{width: 36px;}

@media only screen and (max-height: 550px){
    .fullscreen_menu{overflow: auto;}
    .menu_wrap{position: relative; width: 100%; text-align: center; padding-left: 0;}
    .menu_wrap2{position: relative; margin-top: 100px; width: 100%; text-align: center; padding-right: 0;}
    .menu_wrap2 ul{text-align: center;}
    .menu_wrap2_contact span.bd_b50{margin: 0 auto; float: unset; margin-top: 20px;}
}

@media only screen and (max-width: 1280px){
    .close_btn{width: 30px;}
    .menu_wrap li{font-size: 42px; padding-bottom: 36px;}
    .menu_wrap2_contact a p{font-size: 36px;}
    .menu_wrap2_contact a span{font-size: 18px;}
    .menu_wrap2_contact > p:first-of-type{font-size: 16px; padding-top: 10px;}
    .menu_wrap2_contact > p:nth-of-type(2){font-size: 16px;}
    .menu_wrap2_map p img{width: 28px;}
    .menu_wrap2_map p:first-of-type span{font-size: 36px;}
    .menu_wrap2_map p:nth-of-type(2){padding-top: 15px; font-size: 18px;}
}
@media only screen and (max-width: 768px){
    .close_btn{width: 24px; top: 30px; right: 30px;}
    .fullscreen_menu > img:first-of-type{height: 60px; top: 20px; left: 30px;}
    .menu_wrap{width: 100%; padding-left: unset; left: 0; top: 100px; text-align: center;}
    .menu_wrap li{font-size: 36px; padding-bottom: 24px;}
    .menu_wrap2{width: 100%; padding-right: unset; left: 0; bottom: 40px;}
    .menu_wrap2 ul{padding-top: 120px; text-align: center;}
    .menu_wrap2 ul li{align-items: center;}
    .menu_wrap2_contact a p{font-size: 24px;}
    .menu_wrap2_contact a span{font-size: 14px;}
    .menu_wrap2_contact > p:first-of-type{font-size: 14px;}
    .menu_wrap2_contact > p:nth-of-type(2){font-size: 14px;}
    .menu_wrap2_contact span.bd_b50{width: 50px; height: 1px; float: none; margin: 0 auto; margin-top: 15px;}
    .menu_wrap2_map p img{width: 18px;}
    .menu_wrap2_map p:first-of-type span{font-size: 24px;}
    .menu_wrap2_map p:nth-of-type(2){font-size: 14px;}
}
@media only screen and (max-width: 480px){
    .close_btn{width: 20px; top: 24px; right: 24px;}
    .fullscreen_menu > img:first-of-type{height: 46px; top: 15px; left: 20px;}
    .menu_wrap{top: 80px;}
    .menu_wrap li{font-size: 28px; padding-bottom: 20px;}
}

/* 硫붿씤_v5 */
.main .visual{background: url(../images/bg_main_top.png) no-repeat; background-size: 100%; background-position: 0 -150px; height: 840px; padding-top: 100px;}
.main .slogan{margin-top: 100px; position: relative; color: #3450A3;}
.main .slogan h1{font-size: 120px; text-transform: uppercase; letter-spacing: -5px; line-height: 0.85; font-weight: 300;}
.main .slogan h1 strong{font-weight: 600; }
.main .slogan h1, .main .slogan p{animation-name: fadeInUp; animation-duration: 1.3s; animation-fill-mode: both; }
.main .slogan p{margin-bottom: 25px; font-size: 18px; color: #8d8d8d; text-align: left; text-transform: uppercase; }
.main .slogan .word{display: inline-block; position: relative; }
.main .slogan .word .word_opa{opacity: 0.1;}
.main .slogan .word1{animation-delay: .1s; margin-left: 8%;}
.main .slogan .word2{animation-delay: .2s; margin-left: 0%;}
.main .slogan .word3{animation-delay: .3s; margin-left: -13%;}
.main .slogan .word4{animation-delay: .4s; margin-left: -15%;}


@keyframes fadeInUp{
    from{opacity: 0; transform: translate3d(0, 50px, 0);}

    to{opacity: 1; transform: none;}
}
@-webkit-keyframes fadeInUp{
    from{opacity: 0; transform: translate3d(0, 50px, 0);}

    to{opacity: 1; transform: none;}
}
@-ms-keyframes fadeInUp{
    from{opacity: 0; transform: translate3d(0, 50px, 0);}

    to{opacity: 1; transform: none;}
}

.container{position: relative;}
.visual_btnArea{position: absolute; right: 25%; top: 0; display: flex;}
.visual_btnArea .portfolio_btn{display: flex; padding-right: 30px;}
.visual_btnArea .service_btn{display: flex;}
.visual_btnArea .portfolio_btn,
.visual_btnArea .service_btn{color: #6684B8; font-size: 12px; font-family: 'S-CoreDream-4Regular', 'Noto Sans KR'; line-height: 140%; cursor: pointer;}
.visual_btnArea .portfolio_btn span, 
.visual_btnArea .service_btn span{color: #1C4282; display: block; font-weight: 700; font-size: 18px; padding-bottom: 5px;}
.visual_btnArea .portfolio_btn img, 
.visual_btnArea .service_btn img{height: 50px; padding-right: 20px;}

@media only screen and (max-width: 2050px){
    .main .visual{background-position: 0 0; background-size: cover;}
    .main .slogan .word1{margin-left: 0%;}
    .main .slogan .word2{margin-left: -10%;}
    .main .slogan .word3{margin-left: -26%;}
    .main .slogan .word4{margin-left: -28%;}
    .visual_btnArea{right: 20%;}
}
@media only screen and (max-width: 1800px){
    .main .slogan .word1{margin-left: -5%;}
    .main .slogan .word2{margin-left: -15%;}
    .main .slogan .word3{margin-left: -32%;}
    .main .slogan .word4{margin-left: -34%;}
    .visual_btnArea{right: 15%;}
}
@media only screen and (max-width: 1500px){
    .main .slogan .word1{margin-left: -10%;}
    .main .slogan .word2{margin-left: -25%;}
    .main .slogan .word3{margin-left: -47%;}
    .main .slogan .word4{margin-left: -50%;}
    .visual_btnArea{right: 10%;}
}
@media only screen and (max-width: 1280px){
    .main .visual{height: 70vw;}
    .main .slogan{margin-left: -5vw;}
    .main .slogan h1{font-size: 10vw;}
    .visual_btnArea{position: relative; left: 0; justify-content: center; padding-top: 5vw;}
}
@media only screen and (max-width: 1024px){
    .mainNav{padding: 0 20px;}
    .mainNav .logo a img{width: 80%;}
    .menu_btn .nav-icon{height: 58px; width: 46px; background-size: contain;}

    .scrollNav{height: 80px; line-height: 80px; padding: 0 20px;}
    .menu_btn .nav-icon2{padding-top: 32px;}

    .subNav{padding: 0 20px 20px;}
    .subNav .logo a img{width: 80%;}
    .menu_btn .nav-icon3{height: 58px; width: 46px; background-size: contain;}

    .main .visual{background-size: cover; background-position: -200px 0; height: 70vw; padding-top: 90px;}
    .main .slogan{margin-left: -5vw;}
    .main .slogan h1{font-size: 10.5vw;}
    .visual_btnArea{display: none;}
}
@media only screen and (max-width: 768px){
    .mainNav .logo a img{width: 70%;}
    .menu_btn .nav-icon{height: 50px; width: 39px;}

    .scrollNav{padding-right: 0; font-size: 18px;}

    .subNav .logo a img{width: 70%;}
    .menu_btn .nav-icon3{height: 50px; width: 39px;}

    .main .visual{height: 70vw;}
    .main .slogan{margin-top: 50px;}
}
@media only screen and (max-width: 480px){
    .mainNav .logo a img{width: 50%;}
    .menu_btn .nav-icon{height: 43px; width: 34px;}

    .scrollNav{font-size: 15px;}

    .subNav{padding-bottom: 10px;}
    .subNav .logo a img{width: 50%;}
    .menu_btn .nav-icon3{height: 43px; width: 34px;}

    .main .visual{height: 90vw;}
    .main .slogan{margin-left: -10vw; margin-top: 30px;}
    .main .slogan h1{font-size: 12vw; letter-spacing: -4px;}
}

/*메인_solution_20240725추가*/
.msolutionArea{padding: 100px 0 200px; background-color: #F1F3FA; overflow: hidden;}
.msolutionArea .wrap{display: flex; max-width: 1350px; margin: 0 auto; text-align: center; justify-content: center; margin-top: 100px; position: relative;}
.msolutionArea .wrap .tit h1{text-align: center; font-size: 21px; font-family: 'Play', sans-serif;}
.msolutionArea .wrap .tit h1 span{color: #3450A3; display: block;}
.msolutionArea .aiSolution{width: calc(50% - 10px);}
.msolutionArea .hotelSolution{width: calc(50% - 10px);}

.msolutionArea .wrap::before{content: ''; display: block; width: 500px; height: 500px; background: url(../images/bg_hotelsolution_01.png) no-repeat; background-size: contain; position: absolute; left: -320px; top: -100px;}
.msolutionArea .wrap::after{content: ''; display: block; width: 500px; height: 500px; background: url(../images/bg_hotelsolution_01.png) no-repeat; background-size: contain; position: absolute; right: -300px; top: 100px;}
.msolutionArea .wrap > div{width:480px; height: 300px; position: relative; transform: rotate(26.5deg); z-index: 1;}
.msolutionArea .wrap .aiSolution{background-color: #fff; margin-right: 10px;}
.msolutionArea .wrap .aiSolution:before{content: ""; position: absolute; top: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-bottom: 120px solid #fff;}
.msolutionArea .wrap .aiSolution:after{content: ""; position: absolute; bottom: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-top: 120px solid #fff; z-index: -1;}
.msolutionArea .wrap .hotelSolution{background-color: #F6F9FF; margin-top: 100px; margin-left: 10px;}
.msolutionArea .wrap .hotelSolution:before{content: ""; position: absolute; top: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-bottom: 120px solid #F6F9FF;}
.msolutionArea .wrap .hotelSolution:after{content: ""; position: absolute; bottom: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-top: 120px solid #F6F9FF; z-index: -1;}
.msolutionArea .wrap .tit{transform: rotate(-26.5deg); margin-left: -160px; margin-top: -40px;}
.msolutionArea .wrap .body{transform: rotate(-26.5deg);}
.msolutionArea .aiSolution .body{display: flex; flex-wrap: wrap; margin-left: 40px; justify-content: center;}
.msolutionArea .aiSolution li{width: 40%; position: relative; color: #1C4282; font-family: 'S-CoreDream-5Medium', 'Noto Sans KR'; font-size: 15px; line-height: 140%; margin-top: 100px; margin-bottom: 30px;}
.msolutionArea .aiSolution li::before{content: ''; position: absolute; top: -90px; left: 50%; transform: translateX(-50%); width: 80px; height: 80px;}
.msolutionArea .aiSolution li:nth-of-type(1):before{background: url(../images/ic_msolution_01.png) no-repeat; background-size: cover;}
.msolutionArea .aiSolution li:nth-of-type(2):before{background: url(../images/ic_msolution_02.png) no-repeat; background-size: cover;}
.msolutionArea .aiSolution li:nth-of-type(3):before{background: url(../images/ic_msolution_03.png) no-repeat; background-size: cover;}
.msolutionArea .aiSolution li:nth-of-type(4):before{background: url(../images/ic_msolution_04.png) no-repeat; background-size: cover;}
.msolutionArea .hotelSolution{height: 100%;}
.msolutionArea .hotelSolution .body{display: flex; flex-direction: column; justify-content: space-around; height: 100%; padding-top: 100px;}
.msolutionArea .hotelSolution li{color: #1C4282; font-family: 'S-CoreDream-5Medium', 'Noto Sans KR'; font-size: 15px; line-height: 140%; position: relative; padding-bottom: 140px;}
.msolutionArea .hotelSolution li span{font-weight: 700; display: block;}
.msolutionArea .hotelSolution li::before{content: ''; position: absolute; top: -90px; left: 50%; transform: translateX(-50%); width: 80px; height: 80px;}
.msolutionArea .hotelSolution li:nth-of-type(1):before{background: url(../images/ic_msolution_05.png) no-repeat; background-size: cover;}
.msolutionArea .hotelSolution li:nth-of-type(2):before{background: url(../images/ic_msolution_06.png) no-repeat; background-size: cover;}

.portfolioArea{padding: 100px 0; position: relative;}
#owl-one .owl-item{cursor: pointer; height: 100%; width: 100%; text-align: center;}
#owl-one .owl-item{color: #fff;}
#owl-one .owl-item::after{content: ''; position: absolute; width: 100%; left: 0; z-index: -99;}
#owl-one .owl-item:nth-child(odd)::after{height: 50%; background-color: #3450A3; bottom: 0;}
#owl-one .owl-item:nth-child(even)::after{height: 45%; background-color: #1c2e2e; top: 5%;}
#owl-one .owl-item img{display: inline; width: 80%;}
#owl-one .owl-item p{text-align: center; padding-top: 10px; padding-bottom: 12%;}
#owl-one .owl-item p span{display: block; font-size: 13px; font-weight: 500; padding-top: 5px;}
#owl-one .owl-item:nth-child(odd) p{color: #fff;}
#owl-one .owl-item:nth-child(even) p{color: #353535;}
#owl-one .owl-item:nth-child(odd) p span{color: #9DE3E3;}
#owl-one .owl-item:nth-child(even) p span{color: #A5A6F6;}

@media only screen and (max-width: 1024px){
    .msolutionArea .wrap{margin-top: unset; margin: 0 20px;}
    .msolutionArea .wrap > div{width:50%; height: 500px; transform: rotate(0); padding: 30px 0;}
    .msolutionArea .wrap .aiSolution{margin-right: 0;}
    .msolutionArea .wrap .aiSolution:before{display: none;}
    .msolutionArea .wrap .aiSolution:after{display: none;}
    .msolutionArea .aiSolution .body{margin-left: unset;}
    .msolutionArea .wrap .hotelSolution{margin-top: unset; margin-left: 0;}
    .msolutionArea .wrap .hotelSolution:before{display: none;}
    .msolutionArea .wrap .hotelSolution:after{display: none;}
    .msolutionArea .hotelSolution .body{padding-top: 20px; height: calc(100% - 50px);}
    .msolutionArea .hotelSolution li{padding-bottom: unset;}
    .msolutionArea .wrap .tit{transform: rotate(0); margin-left: unset; margin-top: unset; margin-bottom: 40px;}
    .msolutionArea .wrap .body{transform: rotate(0);}
}
@media only screen and (max-width: 768px){
    .msolutionArea .wrap{flex-direction: column;}
    .msolutionArea .wrap > div{width:100%;}
}
@media only screen and (max-width: 480px){
    .msolutionArea .wrap > div{height: 420px;}
    .msolutionArea .wrap .tit{margin-bottom: 30px;}
    .msolutionArea .aiSolution li{font-size: 14px; margin-top: 70px; margin-bottom: 40px;}
    .msolutionArea .aiSolution li::before{top: -70px; width: 60px; height: 60px;}
    .msolutionArea .hotelSolution li{font-size: 14px;}
    .msolutionArea .hotelSolution li::before{top: -70px; width: 60px; height: 60px;}
}

.jeit_slogan{background: url(../images/bg_jeit_slogan.png); background-attachment: fixed; text-align: center; color: #fff; padding: 0 100px; line-height: 140%; font-family: 'S-CoreDream-2ExtraLight', 'Noto Sans KR';}
.jeit_slogan::before, .jeit_slogan::after{content: ""; display: block; padding-top: 100px;}
.jeit_slogan span{font-family: 'S-CoreDream-5Medium', 'Noto Sans KR';}

.serviceArea{padding: 100px 0 200px; position: relative; background: url(../images/bg_service.png); background-color: #F0F2FA;}

.service-owl{max-width: 1350px; margin: 0 auto;}
#owl-two{width: 100%; margin: 0 auto;}
.card{position: relative; height: 540px; font-family: 'Chakra Petch', sans-serif; text-align: center;}
.card-front, .card-back{position: absolute; width: 100%; height: 100%; transition: 0.9s cubic-bezier(0.25, 0.8, 0.25, 1); backface-visibility: hidden; font-weight: 700; letter-spacing: 2px; font-size: 20px;}
.card-front{background-color: #06A8A8; opacity: .25; color: #fff; padding-top: 200px;}
.card-front:before, .card-front:after, .card-back:before, .card-back:after{position: absolute;}
.card-front:before, .card-back:before{top: calc(50% - 80px); content: ""; width: 60px; height: 60px;}
.card-back{background-color: #fff; transform: rotateY(180deg); padding-top: 40px; color: #3450A3;}
.card-back:after{color: #11181f;}
.card:hover .card-front{transform: rotateY(-180deg);}
.card:hover .card-back{transform: rotateY(0deg);}
.card-front img, .card-back img{padding-bottom: 10px; width: auto!important; margin: 0 auto!important;}
.card_backDetail{display: flex; justify-content: space-between; padding: 30px 50px; font-family: 'Chakra Petch', sans-serif;}
.card_backDetail_A, .card_backDetail_B{width: 50%; letter-spacing: 0;}
.card_backDetail ul.dth_1 > li{color: #353535; font-size: 18px; font-weight: 600; line-height: 230%; display: flex;}
.card_backDetail ul.dth_1 > li::after{content: ''; background: url(../images/bl_card_line.png) no-repeat; height: 1px; width: 40px; margin-top: 25px; margin-left: 5px;}
.card_backDetail .dth_1.pm > li{letter-spacing: -1px; font-family: 'Noto Sans KR'; font-size: 14px; line-height: 250%;}
.card_backDetail ul.dth_2{padding-left: 20px;}
.card_backDetail ul.dth_2 li{color: #727272; text-align: left; font-size: 16px; font-weight: 300; line-height: 150%;}
.card_backDetail ul.dth_3{padding-left: 20px;}
.card-back a.more{display: block; padding-top: 50%;}/*20250131추가*/

@media only screen and (max-width: 1400px){
    .service-owl{width: 95%;}
}
@media only screen and (max-width: 1024px){
    .card_backDetail{padding: 30px 20px;}
    .card_backDetail .dth_1.pm > li{font-size: 15px; letter-spacing: -1px; text-align: left;}
}
@media only screen and (max-width: 768px){
    .service-owl{width: 90%;}
    .card_backDetail{padding: 50px 70px;}
    .card-front, .card-back{transition: none; backface-visibility: unset;}
    .card-back{transform: rotateY(0deg);}
}
@media only screen and (max-width: 480px){
    .card_backDetail{padding: 50px 20px;}
    .card_backDetail ul.dth_1 > li{letter-spacing: -1px; font-size: 15px;}
    .card_backDetail ul.dth_2 li{font-size: 14px;}
    .card_backDetail .dth_1.pm > li{font-size: 13px;}
}

.tit_section{width: 100%; text-align: center;}
.tit_section h1{color: #353535; font-family: 'Play', sans-serif; font-size: 46px; letter-spacing: 3px; padding-bottom: 10px;}
.tit_section h1 span{color: #3450A3;}
.tit_section h1::after{content: ""; background: url(../images/bl_tit_section.png) no-repeat center; display:block; height: 60px;}
.tit_section h1 + p{color: #727272; font-size: 14px; font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; padding-bottom: 75px;}

.btn_gomenu{color: #94AFDC; font-size: 42px; font-weight: 200; position: absolute; right: 20%; top: 150px; padding: 15px;}

@media only screen and (max-width: 1024px){
    .tit_section h1{font-size: 32px; letter-spacing: 2px;}
    .btn_gomenu{right: 10%; top: 120px}
    .tit_section h1::after{background-size: 30px;}
    .jeit_slogan{font-size: 16px;}
    .jeit_slogan::before, .jeit_slogan::after{padding-top: 60px;}
}
@media only screen and (max-width: 768px){
    .tit_section h1{font-size: 24px;}
    .tit_section h1::after{background-size: 25px; height: 45px;}
    .tit_section h1 + p{padding-bottom: 120px;}
    .btn_gomenu{right: calc(50% - 27px ); top: 190px; font-size: 36px;}
    .jeit_slogan{padding: 0 60px;}
}
@media only screen and (max-width: 480px){
    .tit_section h1 + p{font-size: 12px;}
    .tit_section h1::after{background-size: 22px; height: 40px;}
    .jeit_slogan{padding: 0 40px; font-size: 15px; line-height: 180%;}
}

.mapArea{height: 360px; overflow: hidden;}

.footer .contactBar{background-color: #3450A3; color: #fff; text-align: center; padding: 35px 0; font-family: 'S-CoreDream-2ExtraLight', 'Noto Sans KR'; letter-spacing: 0.5px;}
.footer .contactBar span{font-family: 'Chakra Petch', sans-serif; font-weight: 700; color: #D9F5F4; font-size: 18px; padding-left: 20px; letter-spacing: 2px;}

.footer .companyInfo{max-width: 1340px; width: 90%; margin: 0 auto; padding: 80px 0; display: flex; justify-content: space-between;}
.footer .companyInfo .companyInfo_left{color: #353535; min-width: 320px;}
.footer .companyInfo .companyInfo_left .jeit_ko{font-family: 'S-CoreDream-6Bold', 'Noto Sans KR'; padding-bottom: 5px; letter-spacing: 4px;}
.footer .companyInfo .companyInfo_left .jeit_ko span{font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; color: #727272;}
.footer .companyInfo .companyInfo_left .jeit_en{font-family: 'Chakra Petch', sans-serif; font-weight: 500; font-size: 14px; letter-spacing: 4px;}
.footer .companyInfo .companyInfo_left .copyRight{font-family: 'Chakra Petch', sans-serif; font-weight: 400; font-size: 12px; letter-spacing: 1px; color: #A8A8A8; padding-top: 23px;}

.footer .companyInfo .companyInfo_right ul{display: flex; justify-content: space-between;}
.footer .companyInfo .companyInfo_right ul li{padding-right: 50px; font-family: 'S-CoreDream-4Regular', 'Noto Sans KR'; font-size: 15px; color: #353535;}
.footer .companyInfo .companyInfo_right ul li span{display: block; color: #727272; font-family: 'Chakra Petch', sans-serif; font-weight: 300; font-size: 13px; padding-bottom: 12px;}

@media only screen and (max-width: 1280px){
    .footer .companyInfo{display: flex;}
    .footer .companyInfo .companyInfo_left,
    .footer .companyInfo .companyInfo_right{width: 50%;}
    .footer .companyInfo .companyInfo_right{padding-top: 0;}
    .footer .companyInfo .companyInfo_right ul{display: inline-block;}
    .footer .companyInfo .companyInfo_right ul li{padding-right: 0; padding-bottom: 5px;}
    .footer .companyInfo .companyInfo_right ul li span{width: 100px; display: inline-block;}
}
@media only screen and (max-width: 1024px){
    .footer .contactBar{font-size: 18px;}
    .footer .contactBar span{font-size: 16px; padding-left: 10px;}
    .footer .companyInfo{padding: 40px 0;}
    .footer .companyInfo .companyInfo_left .jeit_ko{font-size: 16px; letter-spacing: 2px;}
    .footer .companyInfo .companyInfo_right ul li{font-size: 13px;}
    .footer .companyInfo .companyInfo_right ul li span{width: 65px; font-size: 12px;}
    .footer .companyInfo .companyInfo_left .jeit_en{font-size: 12px; letter-spacing: 1px;}
}
@media only screen and (max-width: 768px){
    .footer .companyInfo{display: block;}.footer .companyInfo .companyInfo_right{margin-top: 30px; padding-top: 30px; width: 100%; border-top: 1px solid #D1D1D1;}
    .footer .companyInfo .companyInfo_right ul li{padding-bottom: 20px;}
    .footer .companyInfo .companyInfo_right ul li span{display: block;}
}
@media only screen and (max-width: 480px){
    .footer .contactBar{font-size: 16px;}
    .footer .contactBar span{font-size: 14px; display: block; padding-top: 5px; padding-left: 0;}
}

.subArea{width: 100%; overflow: hidden; margin-bottom: 80px;}
.subVisual{background-blend-mode: multiply; z-index:10; height: 600px; text-align: center; color: #fff; padding-top: 250px;}
.subVisual.portfolio{background: url(../images/img_subvisual_portfolio.png) no-repeat center center; background-color:rgba(0, 9, 94, 0.6); background-size: cover;}
.subVisual.service{background: url(../images/img_subvisual_service.png) no-repeat center center; background-color:rgba(0, 9, 94, 0.6); background-size: cover;}
.subVisual.photo{background: url(../images/img_subvisual_photo.png) no-repeat center center; background-color:rgba(0, 9, 94, 0.7); background-size: cover;}
.subVisual.contact{background: url(../images/img_subvisual_contact.png) no-repeat center center; background-color:rgba(0, 9, 94, 0.6); background-size: cover;}
.subVisual.solution{background: url(../images/img_subvisual_solution.png) no-repeat center center; background-color:rgba(0, 9, 94, 0.6); background-size: cover;}
.subVisual span{font-size: 18px; color: #fff; opacity: 0.2; display: block; padding-bottom: 10px;}
.subVisual h1{font-family: 'Chakra Petch', sans-serif; font-size: 60px; font-weight: 700; letter-spacing: 14px; opacity: 0.7; /*position: relative; display: inline;*/}
/*
.subVisual h1::after{content: ''; width: 80px; height: 1px; background-color: #fff; position: absolute; left: calc(50% - 40px); bottom: -10px;}
*/
.subContent{width: 90%; max-width: 1350px; margin: 0 auto; padding: 80px 0;}

@media only screen and (max-width: 1024px){
    .subVisual{height: 400px; padding-top: 190px;}
    .subVisual span{font-size: 14px; padding-bottom: 5px;}
    .subVisual h1{font-size: 42px;}
}
@media only screen and (max-width: 768px){
    .subVisual{height: 350px; padding-top: 170px;}
    .subVisual span{font-size: 13px; padding-bottom: 5px;}
    .subVisual h1{font-size: 32px;}
}
@media only screen and (max-width: 480px){
    .subVisual{height: 300px; padding-top: 150px;}
    .subVisual span{font-size: 12px; padding-bottom: 5px;}
    .subVisual h1{font-size: 24px; letter-spacing: 8px;}
}

/*서브페이지 탭영역*/
.subTab{border-bottom: 1px solid #D1D1D1; padding-bottom: 30px; margin-bottom: 100px; display: flex; justify-content: space-between; align-items: flex-end;}
.subTab h1{font-family: 'Chakra Petch', sans-serif; color: #353535; letter-spacing: 12px; font-size: 32px;}
.subTab ul{display: flex; justify-content: flex-end;}
.subTab ul li{color: #353535; font-family: 'Chakra Petch', sans-serif; font-weight: 700; font-size: 18px; margin: 0 20px; padding: 20px 15px 0; cursor: pointer; position: relative;}
.subTab ul li:hover,.subTab ul li:active,.subTab ul li.current{color: #5D5FEF;}
.subTab ul li:hover::before,.subTab ul li:active::before,.subTab ul li.current::before{content: ''; position: absolute; width: 11px; height: 14px; margin-top: -20px; left: calc(50% - 5px); background: url(../images/bl_tab.png) no-repeat;}
.subTab p{color: #727272; font-size: 20px; font-family: 'S-CoreDream-3Light', 'Noto Sans KR';}

.subPage{display: flex; flex-wrap: wrap;}

/*포트폴리오 카드*/
.portfolio_card{width: calc(100% / 3 - 4%); margin: 2%; padding: 2%; position: relative; height: 380px; cursor: pointer;}
.portfolio_card p{font-family: 'S-CoreDream-6Bold', 'Noto Sans KR'; font-size: 20px; letter-spacing: 1px; color: #353535; padding-bottom: 4px;}
.portfolio_card > img{position: absolute; right: 20px; top: 120px; max-width: 70%;}

.portfolio_card:hover{background: url(../images/bg_portfolio_card.png);}
.portfolio_card:hover p{color: #fff; font-size: 34px; letter-spacing: 0; /*20221209추가*/}

.tab-content{display: none;}
.tab-content.current{display: flex; flex-wrap: wrap;}

@media only screen and (max-width: 1024px){
    .subTab{margin-bottom: 50px;}
    .subTab h1{font-size: 24px;}
    .subTab ul li{margin: 0;}
    .portfolio_card{width: calc(100% / 2 - 4%); padding: 4%;}
    .portfolio_card:hover p{font-size: 28px;}
}
@media only screen and (max-width: 768px){
    .subContent{padding-top: 20px;}
    .subTab{display: block; margin-bottom: 30px;}
    .subTab h1{display: none;}
    .subTab ul{justify-content: space-around;}
    .subTab ul li{font-size: 16px;}
    .portfolio_card{height: 260px;}
    .portfolio_card > img{top: 90px;}
}
@media only screen and (max-width: 480px){
    .subTab ul li{font-size: 15px;}
    .portfolio_card{width: 100%; padding: 4%; height: 360px;}
}

/*BTN*/
.loadMore, .submit{margin-top: 50px; width: 100%; text-align: center;}
.loadMore button, .submit button{padding: 12px 40px; background-color: #7879F1; border-radius: 40px; color: #fff; font-family: 'Chakra Petch', sans-serif; font-weight: 700; font-size: 16px; letter-spacing: 1px; cursor: pointer;}
.loadMore button:hover, .submit button:hover{background-color: #5D5FEF;}
.submit button{padding: 12px 100px;}


/*포트폴리오 카드 클릭시 모달창*/
#modal{display:none; position:fixed;  width:100%; height:100%; top:0; left:0;  background:rgba(0,0,0,0.8); z-index: 999999;}
.modal-con{display:none; position:fixed; top:50%; left:50%; transform: translate(-50%,-50%); width: 80%; max-width: 1200px; min-height: 30%; max-height: 90%; background:#fff; padding: 80px 60px 100px; z-index: 9999999; overflow-x:hidden;  overflow-y:auto;}
.modal-con h1{font-size: 60px; font-weight: 200;}
.modal-con .bnArea{padding-bottom: 30px;}
.modal-con .bnArea img{padding-top: 10px;}
.modal-con .close{display:block; position:absolute; right:20px;  top:20px; width:30px;  height:30px; text-align:center;  line-height: 30px;}
.modal-con .img_portfolio,
.modal-con .img_portfolio2{display: flex; flex-wrap: wrap; padding-bottom: 30px;}
.modal-con .img_portfolio img{width: calc(100% / 3 - 15px); height: fit-content; margin-bottom: 15px; margin-right: 15px; box-shadow: 0 3px 30px rgb(0 0 0 / 15%);}
.modal-con .img_portfolio2 img{width: calc(100% / 2 - 20px); margin-bottom: 15px; margin-right: 20px; box-shadow: 0 3px 30px rgb(0 0 0 / 15%);}
.modal-con p{font-size:16px;  line-height:1.5; color: #353535;}


@media only screen and (max-width: 1500px){
    .modal-con .img_portfolio{display:inline;}
    .modal-con .img_portfolio img{width:fit-content;}
}
@media only screen and (max-width: 1024px){
    .modal-con h1{font-size: 48px;}
    .modal-con p{font-size:15px;}
}
@media only screen and (max-width: 768px){
    .modal-con{width: 95%; padding: 60px 40px 70px;}
    .modal-con h1{font-size: 36px;}
    .modal-con p{font-size:14px;}
}
@media only screen and (max-width: 480px){
    .modal-con p{font-size:13px;}
}

.service_card{width: 50%; text-align: center; padding: 200px 0; cursor: pointer;}/*20250131수정*/
.service_card p{color: #353535; opacity: 0.8; font-family: 'Chakra Petch', sans-serif; font-weight: 500; font-size: 32px; letter-spacing: 5px;}
.service_card:nth-child(1){background: url(../images/img_service_server.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}
.service_card:nth-child(2){background: url(../images/img_service_db.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}
.service_card:nth-child(3){background: url(../images/img_service_frontend.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}
.service_card:nth-child(4){background: url(../images/img_service_backend.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}
.service_card:nth-child(5){background: url(../images/img_service_projectmanage.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}
.service_card:nth-child(6){background: url(../images/img_service_online.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}/*20250131수정*/
.service_card:nth-child(7){background: url(../images/img_service_etc.png); background-color: rgba(255, 255, 255, 0.6); background-blend-mode: overlay; background-size: cover; background-position: center center;}/*20250131추가*/
.service_card:hover{background-color: unset;}
.service_card:hover p{font-weight: 700; color: #fff; opacity: 1; text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);}


.modal_service_tit{font-size: 60px; font-weight: 200; border-bottom: 1px solid #D1D1D1; padding-bottom: 30px;}
.modal_service_tit img{padding-right: 15; vertical-align: bottom;}

.modal_service .card_backDetail ul.dth_1 > li{font-size: 24px;}
.modal_service .card_backDetail ul.dth_1 > li::after{margin-top: 34px;}
.modal_service .card_backDetail ul.dth_2 li{font-size: 20px;}
.modal_service .card_backDetail .dth_1.pm > li{font-size: 20px;}

.subPage.online_m{flex-direction: column;}
.subPage.online_m h1{margin: 0 auto; font-size: 36px; padding-bottom: 100px; font-family: 'Play', sans-serif;}
.subPage.online_m h2{font-size: 24px; font-weight: 600; padding-bottom: 50px; font-family: 'S-CoreDream-3Light', 'Noto Sans KR';}
.subPage.online_m img{max-width: 1000px; margin: 0 auto; margin-bottom: 200px; width: 100%;}


@media only screen and (max-width: 1024px){
    .subTab.service p{font-size: 16px;}
    .service_card{padding: 140px 0;}
    .service_card p{font-size: 24px;}
    .modal_service_tit img{height: 52px;}
    .modal_service .card_backDetail .dth_1.pm > li{font-size: 18px;}
}
@media only screen and (max-width: 768px){
    .subTab.service{display: block; border-bottom: none;}
    .subTab.service p{padding-top: 50px; text-align: center;}
    .service_card{padding: 100px 0;}
    .service_card p{font-size: 20px;}
    .modal_service_tit img{height: 40px;}
    .modal_service .card_backDetail{padding: 30px 8px;}
    .modal_service .card_backDetail ul.dth_1 > li{font-size: 20px;}
    .modal_service .card_backDetail ul.dth_1 > li::after{margin-top: 30px;}
    .modal_service .card_backDetail ul.dth_2 li{font-size: 18px;}
    .modal_service .card_backDetail .dth_1.pm > li{font-size: 15px;}
}
@media only screen and (max-width: 480px){
    .subTab.service p{font-size: 14px; line-height: 160%;}
    .service_card{width: 100%; margin-bottom: 20px;}
    .modal_service{padding: 50px 20px 50px;}
    .modal_service .close{width: 24px;}
    .modal_service .card_backDetail{padding: 30px 5px;}
    .modal_service .card_backDetail ul.dth_1 > li{font-size: 18px;}
    .modal_service .card_backDetail ul.dth_1 > li::after{width: 15px; margin-top: 25px;}
    .modal_service .card_backDetail ul.dth_2 li{font-size: 16px;}
    .modal_service .card_backDetail ul.dth_2{padding-left: 0;}
    .modal_service .card_backDetail .dth_1.pm > li{font-size: 14px;}
    .modal_service_projectmanage h1{font-size: 30px; letter-spacing: -2px;}
    .modal_service_projectmanage .modal_service_tit img{height: 32px;}
}

.photo_card{width: calc(50% - 80px); position: relative; margin: 40px;}
.photo_card::after{content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: linear-gradient(-148deg, rgba(0, 0, 0, 0) 50%, #3450a3 100%);}
.photo_card p{color: #fff; font-family: 'S-CoreDream-5Medium', 'Noto Sans KR'; font-size: 36px; text-align: left; position: absolute; bottom: 70px; left: 40px; z-index: 1; line-height: 180%;}
.photo_card p span{font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; font-size: 19px; display: block; line-height: 80%; opacity: 0.5; padding-left: 2px;}
.photo_card p.moto{font-size: 20px; bottom: 25px; color: #1C4282;}

@media only screen and (max-width: 1280px){
    .photo_card{width: calc(50% - 40px); margin: 20px }
    .photo_card p{font-size: 26px; left: 20px; bottom: 50px;}
    .photo_card p span{font-size: 15px;}
    .photo_card p.moto{font-size: 17px; bottom: 15px;}
}
@media only screen and (max-width: 1024px){
    .photo_card::after{background: linear-gradient(270deg, rgba(0, 0, 0, 0) 30%, #3450a3 100%);}
    .photo_card img{margin-top: 20px;}
    .photo_card p{font-size: 21px; left: 20px;}
    .photo_card p span{font-size: 14px;}
    .photo_card p.moto{font-size: 16px;}
}
@media only screen and (max-width: 768px){
    .photo_card{width: 100%; height: 190px; margin: 0 0 20px; position: relative;}
    .photo_card::after{background: linear-gradient(270deg, rgba(0, 0, 0, 0) 20%, #3450a3 100%);}
    .photo_card img{width: 300px; position: absolute; right: 0;}
    
    .photo_card p{bottom: 70px; left: 30px;}
    .photo_card p.moto{bottom: 35px;}
}
@media only screen and (max-width: 480px){
    .photo_card{height: 160px;}
    .photo_card img{width: 240px;}
    .photo_card p{font-size: 18px;}
    .photo_card p span{font-size: 13px;}
    .photo_card p.moto{font-size: 14px; letter-spacing: -0.05rem;}
}

.contact_exp{font-family: 'S-CoreDream-5Medium', 'Noto Sans KR'; font-size: 30px; line-height: 120%; letter-spacing: -2px; color: #353535; padding-bottom: 70px;}
.contact_exp span{display: block; font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; font-size: 18px; color: #727272; letter-spacing: 0;}
.contactArea{width: 100%; color: #353535; font-size: 18px;}
.contactArea ul{padding-bottom: 100px;}
.contactArea ul li{border-bottom: 1px solid #D1D1D1; padding: 20px;}
.contactArea ul li dl{display: flex;}
.contactArea ul li dl dt{width: 100px; font-family: 'S-CoreDream-5Medium', 'Noto Sans KR'; vertical-align: middle; line-height: 24px; font-size: 18px;}
.contactArea ul li dl dd{font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; width: 100%;}
.contactArea ul li dl dd input{border: none; outline: none; height: 24px; width: 100%; font-size: 18px;}
.contactArea .box-file-input{font-size: 14px;}
.contactArea .box-file-input label{display:inline-block; padding: 5px 15px; cursor:pointer; border: 1px solid #D1D1D1; border-radius: 20px; color: #A8A8A8; font-family: 'Noto Sans KR', '돋움체'; font-size: 18px;}
.contactArea .box-file-input label:after{content:"파일등록";}
.contactArea .box-file-input .file-input{display:none;}
.contactArea .box-file-input .filename{display:inline-block; padding-left:10px; color: #A8A8A8; font-size: 17px;}

.contactArea > p{font-size: 24px; font-family: 'S-CoreDream-5Medium', 'Noto Sans KR'; padding-bottom: 20px; letter-spacing: -2px;}
.contactArea textarea{width: 100%; height: 220px; padding: 20px; border: 1px solid #D1D1D1; outline: none; font-size: 16px;}

.contactArea .agreeArea{padding: 60px 0 20px; position: relative;} 
/* 기본 체크박스 없애기*/
.contactArea .agreeArea input[type="checkbox"]{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0}

/* 웹의 경우 커서에 pointer 설정*/
.contactArea .agreeArea input[type="checkbox"] + label{display: inline-block; position: relative; cursor: pointer; font-size: 19px;}

/* 새로운 디자인의 체크박스 만들기*/
.contactArea .agreeArea input[type="checkbox"] + label:before{content: ' '; display: inline-block; width: 20px; height: 20px; line-height: 20px; margin: -4px 15px 0 0; text-align: center; vertical-align: middle; border: 1px solid #cacece;}
.contactArea .agreeArea input[type="checkbox"]:checked + label:before{content: '\2714'; color: #fff; background: #7879F1; border: none; width: 22px; height: 22px; line-height: 22px;}



@media only screen and (max-width: 1024px){
    .contact_exp{padding-bottom: 40px;}
    .contactArea .agreeArea{padding: 30px 0 20px;}
}
@media only screen and (max-width: 768px){
    .subContent{padding-bottom: 0;}
    .loadMore, .submit{margin-top: 20px;}
    .contact_exp{padding-top: 40px; padding-bottom: 20px;}
    .contact_exp,
    .contactArea > p{font-size: 24px;}
    .contact_exp span,
    .contactArea,
    .contactArea .box-file-input label{font-size: 15px;}
    .contactArea ul{padding-bottom: 80px;}
    .contactArea ul li dl dt,
    .contactArea ul li dl dd input,
    .contactArea .box-file-input .filename{font-size: 16px;}
    .contactArea .agreeArea input[type="checkbox"] + label{font-size: 17px;}
}
@media only screen and (max-width: 480px){
    .contact_exp,
    .contactArea > p{font-size: 20px; padding: 30px 0 15px;}
    .contact_exp span,
    .contactArea,
    .contactArea .box-file-input label{font-size: 13.5px;}
    .contactArea ul{padding-bottom: 40px;}
    .contactArea ul li{padding: 15px 10px;}
    .contactArea ul li dl dt,
    .contactArea ul li dl dd input,
    .contactArea .box-file-input .filename{font-size: 14px;}
    .contactArea .box-file-input .filename{display: block; padding-top: 8px;}
    .contactArea .agreeArea input[type="checkbox"] + label{font-size: 16px;}
}

/*20240725추가*/
/*SOLUTION*/
/*JeitSolution_20240725추가*/
.aisolutionArea{padding: 100px 0; margin: 0 auto;}
.aisolutionArea .tit_section{margin-bottom: 30px;}
.aisolutionArea .tit_section h1::after{display: none;}
.aisolutionArea ul{display: flex; max-width: 1350px; margin: 0 auto; flex-wrap: wrap}
.aisolutionArea ul li{background-color: #F1F4FD; width: calc(50% - 0.5rem); margin: 0 1rem 1rem 0; padding: 2rem;}
.aisolutionArea ul li:nth-of-type(2n){margin-right: 0;}
.aisolutionArea ul li p.tit{color: #1C4282; font-size: 30px; font-weight: 600; margin-bottom: 20px; margin-top: 10px; font-family: 'S-CoreDream-6Bold', 'Noto Sans KR';}
.aisolutionArea ul li p.body{color: #353535; font-size: 16px; font-weight: 300; line-height: 160%; font-family: 'S-CoreDream-3Light', 'Noto Sans KR';}

@media only screen and (max-width: 1400px){
    .aisolutionArea{width: 90%;}
}
@media only screen and (max-width: 1024px){
    .subTab.solution{flex-direction: column; align-items: flex-start;}
    .subTab.solution p{padding-top: 10px; font-size: 14px;}
    .aisolutionArea ul{flex-direction: column;}
    .aisolutionArea ul li{width: 100%;}
    .aisolutionArea ul li p.tit{font-size: 21px;}
    .aisolutionArea ul li p.body{font-size: 14px;}
}
@media only screen and (max-width: 768px){
    .aisolutionArea ul li p.tit{font-size: 18px;}
    .smarthotleArea ul li p.tit{font-size: 16px;}
}
@media only screen and (max-width: 480px){
    .subTab.solution p{line-height: 160%; font-size: 13px;}
    .aisolutionArea ul li{padding: 1rem;}
    .aisolutionArea ul li img{width: 20px;}
}

/*Jeit Smart Hotel Solution_20240725추가*/
.subVisual.solution + .subContent{width: 100%;}
.subTab.solution{width: 90%; margin: 0 auto;}
.smarthotleArea{width: 100%; padding: 100px 0; background-color: #F1F3FA; overflow: hidden;}
.smarthotleArea .tit_section{margin-bottom: 30px;}
.smarthotleArea ul{display: flex; max-width: 1350px; margin: 0 auto; text-align: center; justify-content: center; margin-top: 100px; position: relative;}
.smarthotleArea ul::before{content: ''; display: block; width: 500px; height: 500px; background: url(../images/bg_hotelsolution_01.png) no-repeat; background-size: contain; position: absolute; left: -320px; top: -100px;}
.smarthotleArea ul::after{content: ''; display: block; width: 500px; height: 500px; background: url(../images/bg_hotelsolution_01.png) no-repeat; background-size: contain; position: absolute; right: -300px; top: 100px;}
.smarthotleArea ul li{width:480px; height: 300px; position: relative; transform: rotate(26.5deg); padding-top: 40px; z-index: 1;}
.smarthotleArea ul li:nth-of-type(1){background-color: #fff; margin-right: 10px;}
.smarthotleArea ul li:nth-of-type(1):before{content: ""; position: absolute; top: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-bottom: 120px solid #fff;}
.smarthotleArea ul li:nth-of-type(1):after{content: ""; position: absolute; bottom: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-top: 120px solid #fff;}
.smarthotleArea ul li:nth-of-type(2){background-color: #F6F9FF; margin-top: 100px; margin-left: 10px;}
.smarthotleArea ul li:nth-of-type(2):before{content: ""; position: absolute; top: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-bottom: 120px solid #F6F9FF;}
.smarthotleArea ul li:nth-of-type(2):after{content: ""; position: absolute; bottom: -120px; left: 0; width: 0; height: 0; border-left: 240px solid transparent; border-right: 240px solid transparent; border-top: 120px solid #F6F9FF;}
.smarthotleArea ul li p{transform: rotate(-26.5deg);}
.smarthotleArea ul li p.tit{color: #1C4282; font-size: 30px; font-weight: 100; font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; margin-bottom: 40px; position: relative; width: 90%;}
.smarthotleArea ul li p.tit span{font-weight: 600; font-family: 'S-CoreDream-6Bold', 'Noto Sans KR'; line-height: 140%;}
.smarthotleArea ul li p.tit::after{content: ''; width: 20px; height: 1px; background-color: #1C4282; display: block; position: absolute; left: 50%; bottom: -20px; transform: translateX(-50%);}
.smarthotleArea ul li p.body{color: #353535; font-size: 16px; font-weight: 100; line-height: 150%; font-family: 'S-CoreDream-3Light', 'Noto Sans KR'; width: 80%; margin: 0 auto; margin-right: 25px;}

@media only screen and (max-width: 1024px){
    .smarthotleArea{padding-bottom: 100px;}
    .smarthotleArea ul{flex-direction: column; width: 90%; margin-top: 0;}
    .smarthotleArea ul li{width: 100%; transform: rotate(0deg); height: auto; padding-bottom: 40px;}
    .smarthotleArea ul li p{transform: rotate(0deg);}
    .smarthotleArea ul li:nth-of-type(1):before, .smarthotleArea ul li:nth-of-type(1)::after, .smarthotleArea ul li:nth-of-type(2):before, .smarthotleArea ul li:nth-of-type(2)::after{display: none;}
    .smarthotleArea ul li:nth-of-type(1){margin-right: 0; margin-bottom: 10px;}
    .smarthotleArea ul li:nth-of-type(2){margin-top: 0; margin-left: 0;}
    .smarthotleArea ul li p.tit{width: 100%; font-size: 21px;}
    .smarthotleArea ul li p.body{width: 90%; margin-right: unset; margin: 0 auto; font-size: 14px;}
}