* { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } :after, :before {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; } /* scrollbar */ ::-webkit-scrollbar { width: 5px; } ::-webkit-scrollbar-track { background-color: #f3f3f3; border-radius:8px;border:1px solid #ededed;} ::-webkit-scrollbar-thumb { background-color: #666;border-radius:8px; } ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment, ::-webkit-scrollbar-corner, ::-webkit-scrollbar-button:vertical:incremen, ::-webkit-scrollbar-button:vertical:decrement, ::-webkit-scrollbar-button:horizontal:increment, ::-webkit-scrollbar-button:horizontal:decrement{ display:none; } html{ scrollbar-3dLight-Color: #f3f3f3; scrollbar-arrow-color: #f3f3f3; scrollbar-Face-Color: #666; scrollbar-Track-Color: #f3f3f3; scrollbar-DarkShadow-Color: #666; scrollbar-Highlight-Color: #666; scrollbar-Shadow-Color: #666; /*firefox*/ scrollbar-face-color:#666; scrollbar-track-color: #f3f3f3; scrollbar-color:#666 #f3f3f3; scrollbar-width: thin; } html,body { margin: 0; padding: 0;} /* reset */ /*body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,figure,figcaption{margin:0;padding:0}*/ body,input,textarea,select,button,table{font-family:'Lato','Open Sans',AppleGothic,helvetica,sans-serif;font-size:20px; line-height:1.4rem; letter-spacing:-.01em; word-break:keep-all;-webkit-text-size-adjust:none; overflow-y: auto; color: #111; } img{border:0;max-width:100%;} ul,ol{list-style:none} fieldset{border:none} fieldset legend {overflow:hidden;width:0;height:0;margin:0;padding:0;font-size:0;line-height:0;text-indent:-999em;} button{cursor:pointer} header,hgroup,article,nav,footer,figure,figcaption,canvas,section,time{display:block} hr {clear:both;display:none;} img[usemap] {border:none; height:auto; max-width:100%; width:auto;} .m-head.ce{text-align: center; margin-bottom: 30px;} .m-head.ri{text-align: right;} .m-head.dark{ color: #000;} .m-sub.b { color: #111; font-size: 18px; line-height: 1.6rem; word-break: keep-all;} .m-sub.bb{ color: #111; font-size: 18px; line-height: 1.2rem; font-weight: 600; word-break: keep-all;} .m-sub.w { color: #fff; font-size: 18px; line-height: 1.2rem; margin-top: 30px; word-break: keep-all;} .in-sub {font-size: 18px;} .space { justify-content: space-around;} .justify { justify-content: center;} .company{ font-weight: 600; margin-bottom: 10px;} .center { text-align: center;} .left { text-align: left;} .full_img{ width:100%;} .text_b {margin-bottom: 10px;} .text_bb {margin-bottom: 30px;} .section-padding { padding: 80px 0;} .wrap{ position:relative; top:0; width:100%;height:100%; transition: 0.5s;} .loading.loading05 span{ color: #0d1735; font-family: 'Lora','Open Sans', sans-serif; } .img_box{ margin-top: 20px;} .cs_section_heading.cs_style_1 .cs_section_title { margin-top: -9px;} /*header*/ .cs_nav_list a.active { position: relative; font-weight: bold;} .cs_nav_list a.active::after { content: ''; position: absolute; top: 22px; left: 50%; transform: translateX(-50%); width: 8px; height: 8px; background-color: #fff; border-radius: 50%;} .cs_creative_protfolio_menu ul{ margin-bottom: 0;} .cs_project_card{ margin-top: 45px;} .cs_project_card_img { aspect-ratio: 1 / 1; overflow: hidden; background: #f0f0f0; } .cs_project_card_img img { width: 100%; height: 100%; object-fit: cover; } .cs_post_title{font-size: 22px; margin-bottom: 0;} .cs_title{margin-bottom: 0;} .cs_subtitle{ color: #111;} .cs_title:hover { color: #122b7d; text-decoration-line: underline; } .cs_post_title { color: #122b7d;} .cs_creative_protfolio_details .cs_project_card .cs_project_card_text .cs_subtitle {text-transform: capitalize;} .modal-content{ overflow-y: auto;} #portfolio_01 .cs_section_heading_text p {font-size: 28px;} #portfolio_01 .cs_section_heading.cs_style_1 .cs_section_title{margin-bottom: 20px;} :root, html { scroll-behavior: auto !important; } /*index*/ .movie{ padding: 80px 0 90px 0;} .cs_hero_bg { position: relative; width: 90%; max-width: 1320px; height: 700px; overflow: hidden;} .cs_hero_bg video { width: 100%; height: 100%; object-fit: cover;} .cs_bg_video { position: absolute; width: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1;} /*#video.section-padding{ position: relative; overflow: hidden;} #video.section-padding .ratio_1x1{display: none;} #video.section-padding .ratio{ position: relative; z-index: 1;} #video.section-padding iframe{ position: absolute; top: -200px; left: 0; width: 100%; height: calc(100% + 400px); }*/ .cs_section_heading.cs_style_1.cs_type_1 .cs_section_heading_right { margin-top: 0;} #home_01 .cs_section_heading.cs_style_1 .cs_section_title {color: #111; margin-top: -9px;} #home_01 { position: relative;} #home_01 .img_box{ margin-top: 0;} .cs_section_heading_text.hidden { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 10; background: rgba(0, 0, 0, 0.4); color: #fff; padding: 20px; text-align: center; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; transition-duration: 1.5s;} .cs_section_heading_text.hidden h2{ color: #fff; font-size: 38px; font-weight: 500; margin-bottom: 0px; line-height: 1.1;} .img_box { position: relative; display: inline-block; } .img_box img { width: 100%; height: auto; display: block; } /*.img_box:hover .cs_section_heading_text { opacity: 1; visibility: visible; }*/ .cs_section_heading_text.hidden { opacity: 0; visibility: visible; animation: fadeIn 7.0s ease-in-out forwards; } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } /**/ #home_02 {} #home_02 .step{ padding: 45px 0 0 0;} /*#home_02 .cs_modern_needs.cs_style .cs_col_md_720 { flex-basis: 720px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 .cs_stroke_text { line-height: 1.1; vertical-align: middle; align-items: center; display: flex;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 .cs_stroke_text h6{ margin-bottom: 0; font-size: 26px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ top: 41%; left: -10%; padding: 55px;} #home_02 .cs_col_md_672 .cs_img_section { position: relative;} #home_02 .cs_btn.cs_style_1{margin: 20px 0 0 0;} #home_02 .cs_stroke_text { font-family: 'Lora', 'Open Sans', AppleGothic, helvetica, sans-serif; font-weight: 500;}*/ #home_02 .big-img {display: none;} #home_02 .small-img { display: block;} #home_02 .cs_section_heading_text { width: 76%;} .wrap { display: flex; justify-content: center; align-items: center; position: relative; width: 100%; max-width: 100%; margin: auto;} .box { overflow: hidden; width: 100%; position: relative; max-width: 100%;} .slide_box { display: flex; transition: transform 0.5s ease-in-out;} .slide_item { flex-shrink: 0; position: relative; width: 100%; } .slide_item img { width: 100%; display: block;} .prev, .next { padding: 10px; cursor: pointer; color: #111; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; font-size: 30px;} .prev:hover, .next:hover { color: #bdbdbd;} .prev { left: -60px;} .next { right: -60px;} .cs_img_card_text { position: absolute; top: 56%; left: 0; height: 210px; padding: 33px; color: #fff; width: 80%; background-color: #0d1634bf; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; gap: 10px;} .cs_section_heading.cs_style_1 .cs_section_title { font-size: 32px;} .cs_img_card_text h6 { margin-bottom: 0;} .cs_img_card_text p { margin-bottom: 0; margin-top: 10px;} #home_03.home-portfolios{ background: rgba(217, 217, 217, 0.2);} #home_03 .sub_text.head { font-weight: 700; font-size: 20px; margin-bottom: 10px;} #home_03 .sub_text{ line-height: 1.5rem;} #home_03 .cs_post_info h2{ line-height: 1.4rem; letter-spacing: -2px;} #home_03 .modal-content{ margin: 13% auto;} #home_03 .modal {display: none; position: absolute; z-index: 1000; background-color: transparent;} #home_03 .cs_post_title{ letter-spacing: 0px;} #home_03 .cs_section_heading.cs_style_1.cs_type_1 { margin-bottom: 0;} #home_03 .cs_project_card_text {margin-top: 30px; margin-left: 30px; padding: 0px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} #home_03 .cs_section_heading.cs_style_1 .cs_section_title {margin-bottom: 0;} #home_04 .cs_modern_needs.cs_style{ justify-content: normal;} #home_04 .cs_section_heading_text{ width: 76%;} /*about*/ #about_01 .align-items-center{ padding: 45px 0 0;} #about_01 .cs_section_heading.cs_style_1.cs_color_1 .cs_section_title, .cs_section_heading.cs_style_1.cs_color_1 .cs_section_title_2, .cs_section_heading.cs_style_1.cs_color_1 .cs_section_title_3, .cs_section_heading.cs_style_1.cs_color_1 .cs_section_title_4, .cs_section_heading.cs_style_1.cs_color_1 .cs_section_subtitle {color: #111;} #about_01 .portfolio_successfull{ display: grid; grid-template-columns: repeat(1, 1fr); grid-auto-flow: dense;} #about_01 .text-end.one{margin-bottom: 31px;} #about_01 .num{ color: #102260; font-family: 'Lora', 'Open Sans', AppleGothic, helvetica, sans-serif;} #about_01 .sub-h h4, #about_01 .sub-h p{ text-align: center;} #about_02 .img_box {padding-bottom: 45px; margin-top: 0;} #about_02 .text_bb p{ margin-bottom: 0;} #about_02 .cs_accordeon .cs_accordion_item .cs_accordion_header.active{ background-color: rgba(217, 217, 217, 0.2);} #about_02 .cs_accordeon .cs_accordion_item.last{ margin-bottom: 0;} #about_03.cs_shape_wrap_3 .cs_shape_2{ left: 85%; bottom: 80%;} #about_03 .cs_post.cs_style_2 .cs_post_info{ background-color: #fff;} #about_03 .cs_post.cs_style_2 .cs_post_info .cs_post_title { color: #0d1634;} #about_03 .cs_post.cs_style_2 .cs_post_info p {color: #111; } #about_03 .cs_btn.cs_style_1.cs_color_1{color: #111;} #about_04.cs_shape_wrap_3 .cs_shape_2 { left: 88%; bottom: 86%; animation: animo-y 8s cubic-bezier(0.4, 0, 0.2, 1) infinite;} #about_04 .cs_card_subtitle{line-height: 1.4rem} #about_04 .cs_card_right .cs_card_right_in h2{letter-spacing: -2px;} #about_04 .title h2 { font-size: 35px; padding-top: 45px;} /*value*/ #value_01.cs_shape_wrap_3 .cs_shape_1{ top: 60%;} #value_01 .p_box{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} #value_01 .cs_section_title_4{font-weight: 600;} #value_01 .modules{ padding: 45px 0 0 0;} #value_01 .col-lg-4.col-md-12.title .cs_section_title {font-size: 38px; line-height: 1.2em;} #value_02 .cs_value a { border: 1px solid #d9d9d9; padding: 10px 15px; min-height: 70px;} #value_02 .cs_value { display: grid; grid-gap: 15px 30px; grid-template-columns: repeat(1, 1fr); color: #111;} #value_02 .cs_value.one .cs_center{background-color: rgba(217, 217, 217, 0.2); color: #4f4f4f; text-align: center;} #value_02 .cs_value.two .cs_center{background-color: #0d1634; color: #fff; text-align: center;} #value_02 .traditional .cs_section_title_4{color: #4f4f4f; text-align:center; margin: 10px;} #value_02 .new .cs_section_title_4{ text-align: center; margin: 10px;} #value_02.approach h2{ text-transform: capitalize;} /*portfolio*/ #portfolio_01 .cs_creative_protfolio_menu ul { padding: 30px 0 0 0;} #portfolio_01 .cs_creative_protfolio_menu ul li:hover{ color: #122b7d; text-decoration-line: underline; } #portfolio_01 .protfolio_active {font-weight: bold; color: #122b7d; } #portfolio_01 .cs_post_title{ letter-spacing: 0px;} #portfolio_01 .cs_title {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;} #portfolio_01 .cs_subtitle.portfolio { font-size: 17px;} .modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); overflow: hidden;} .modal-content { position: relative; top: 0%; background-color: #fff; margin: 13% auto; padding: 15px; border: 1px solid #888; width: 65%; /*max-width: 700px;*/ border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); text-align: center; z-index: 10000;} .modal-content h2{ margin: 0; font-size: 40px; font-weight: 700; text-align: left; text-overflow: ellipsis; overflow: hidden; word-break: break-word;} .modal-content p { margin: 0; font-size: 17px; font-weight: 400; text-align: left;} .open-modal{cursor: pointer;} .disable-pointer-events { display: none;} .close { position: absolute; top: 10px; right: 20px; color: #aaa; font-size: 28px; font-weight: bold; cursor: pointer;} .close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer;} .no-scroll { position: fixed; width: 100%; overflow: hidden; top: 0; left: 0;} .modal-header { display: flex; justify-content: space-between; align-items: center; text-align: center; width: 100%;} .modal-header h2 { flex: 1; display: flex; justify-content: flex-start; align-items: center; padding: 0px; } .web { flex: 1; display: flex; justify-content: flex-end; align-items: center; padding: 10px; } .web span.btn{ background: #071131; color: #fff; border: 1px solid #071131; margin-left: 16px;} .web span.btn.a {background: #fff; color: #071131; border: 1px solid #071131;} .web span.btn:hover{transform: translateY(-.15rem); transition-property: all; transition-duration: 0.3s} .logo-block.box,{} .logo-block.box img { max-width: 100px; height: auto; } .info-block.text{ gap: 29px; display: flex; flex-direction: column; margin-bottom: 20px;} hr { margin: 20px 0; border: 0; border-top: 1px solid #ccc;} .modal-info { display: flex; justify-content: space-between; margin-top: 20px; align-items: center; border-top: 1px solid #eee; align-items: flex-start;} .info-block { flex: 1; margin-top: 20px;} .info-block:nth-child(1) { padding: 0 1rem;} .info-block:nth-child(2) { padding: 0 1rem;} .logo-block.box{ position: absolute; right: 28%;} .info-block.logo{ display: flex; flex-direction: column; align-items: flex-start; padding: 0 1rem;} .web-logo-box {margin-top: 10px;} .web-logo-box img{ max-width: 100px; /*object-fit: cover;*/ margin-right: 10px; height: 60px;} /*#modal-investment-date-1, #modal-location-1, #modal-location-1, #modal-industry-1{margin-top: 10px;}*/ #modal-description-1 {/*overflow-y: auto;*/ height: 130px; padding: 0 10px; padding: 20px 18px; } #modal-description-1 { scrollbar-width: thin; scrollbar-color: #888 #f1f1f1; } #modal-description-1::-webkit-scrollbar { width: 12px;} #modal-description-1::-webkit-scrollbar-track { background: #f3f3f3; border-radius: 10px;} #modal-description-1::-webkit-scrollbar-thumb { background-color: #666; border-radius: 10px; border: 3px solid #f1f1f1;} #modal-description-1::-webkit-scrollbar-thumb:hover { background-color: #555;} #modal-description-2 {/*overflow-y: auto;*/ height: 130px; padding: 0 10px; padding: 20px 18px;} #modal-description-2 { scrollbar-width: thin; scrollbar-color: #888 #f1f1f1; } #modal-investment-date-2, #modal-location-2, #modal-location-2, #modal-industry-2{margin-top: 10px;} #modal-description-2 {overflow-y: auto; height: 130px;} #modal-description-2::-webkit-scrollbar { width: 12px;} #modal-description-2::-webkit-scrollbar-track { background: #f3f3f3; border-radius: 10px;} #modal-description-2::-webkit-scrollbar-thumb { background-color: #666; border-radius: 10px; border: 3px solid #f1f1f1;} #modal-description-2::-webkit-scrollbar-thumb:hover { background-color: #555;} #modal-description-3 {/*overflow-y: auto;*/ height: 130px; padding: 0 10px; padding: 20px 18px;} #modal-description-3 { scrollbar-width: thin; scrollbar-color: #888 #f1f1f1; } #modal-investment-date-3, #modal-location-3, #modal-location-3, #modal-industry-3{margin-top: 10px;} #modal-description-3 {overflow-y: auto; height: 130px;} #modal-description-3::-webkit-scrollbar { width: 12px;} #modal-description-3::-webkit-scrollbar-track { background: #f3f3f3; border-radius: 10px;} #modal-description-3::-webkit-scrollbar-thumb { background-color: #666; border-radius: 10px; border: 3px solid #f1f1f1;} #modal-description-3::-webkit-scrollbar-thumb:hover { background-color: #555;} #modal-description-3 { scrollbar-width: thin; scrollbar-color: #888 #f1f1f1; } /*********************************************/ #modal-subtitle {border-bottom: 1px solid #111;} /*map*/ #map .cs_google_map{ height: 500px;} #map .cs_icon_subtitle i { margin-right: 10px;} #map .cs_icon .cs_icon_text .cs_icon_subtitle { /*font-size: 18px; margin-top: 10px;*/ text-indent: -13px; margin-left: 26px; margin-bottom: 0;} #map .cs_icon_subtitle .tel:hover{color: #122b7d; text-decoration: underline;} #map .corporation {font-size: 16px; margin-bottom: 0;} /*footer*/ #footer.section-padding{ padding: 0;} #footer .f.container{ padding: 80px 0;} #footer p {font-size: 14px; margin-bottom: 0;} #footer .cs_copyright { height: auto;} #footer .cs_footer_info img {max-width: 100%; height: auto; } /* scroll to top */ .scroll-top-arrow, .scroll-top-arrow:focus { background: #192c63; font-size: 25px; line-height: 34px; box-shadow: 0 0 25px rgba(23,23,23,.25); display: none; height: 50px; width: 50px; padding: 8px; position: fixed; right: 20px; text-align: center; text-decoration: none; bottom: 50px; z-index: 1029; border-radius: 100%;} .scroll-top-arrow:hover { background: #192c63; color: #828282; box-shadow: 0 0 30px rgba(23,23,23,.4); -webkit-transform: translateY(-4px); -ms-transform: translateY(-4px); transform: translateY(-4px);} .scroll-top-arrow i {color: #fff;} @media all and (min-width:1770px) and (max-width:1850px) { #home_02 .cs_modern_needs.cs_style .cs_col_md_672 { flex-basis: 550px;} } @media all and (min-width:1400px) and (max-width:1769px) { #map .cs_google_map { height: 500px !important;} } @media all and (min-width:1200px) and (max-width:1769px) { #video.movie { padding: 100px 0;} #video .cs_hero_bg { width: 90%; max-width: 1320px; height: 600px;} #video .cs_hero.cs_style2 { height: auto;} #home_02 .cs_modern_needs.cs_style { width: 100%;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ top: 37%; left: -5%;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 { flex-basis: 600px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 { flex-basis: 450px;} #portfolio_01 .cs_subtitle {margin-bottom:0;} .cs_creative_protfolio_details .cs_project_card .cs_project_card_text {display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 1; width: 400px; box-sizing: border-box; } .web-logo-box { display: flex;} #map .cs_google_map {height: 430px;} } @media all and (min-width:1200px) and (max-width:1439px) { #video .cs_hero_bg { width: 90%; height: 550px;} .cs_img_card_text { top: 50%;} } @media (max-width: 1199px) { .section-padding{ padding: 40px 0;} .cs_height_90 {height: 90px;} /*.img_box{ padding: 25px 0 0 0;}*/ #footer .f.container{ padding: 40px 0;} .cs_section_heading.cs_style_1 .cs_section_title {margin-top: -9px;} /*index*/ #video.section-padding{ padding: 80px 0 0 0;} #video .cs_hero_bg { width: 90%; height: 457px; } #video .cs_bg_video { width: 100%; height: auto;} #video .cs_hero.cs_style2 { height: 560px; min-height: 0; margin: 0;} .cs_section_heading_text.hidden { opacity: 0; visibility: visible; animation: fadeIn 7.0s ease-in-out forwards; } #home_02 .cs_btn.cs_style_1{margin: 20px 0;} #home_02 .cs_modern_needs.cs_style { width: 100%;} /*#home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ top: 27%; left: -4%;}*/ .cs_img_card_text { top: 49%;} #home_02 .big-img { display: block; width: 100%;} #home_02 .small-img { display: none;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 { flex-basis: auto;} #home_02 .cs_modern_needs.cs_style {display: unset;} #home_03 .cs_project_card_text { margin-top: 20px; margin-left: 20px; width: 200px; -webkit-line-clamp: 1;} #home_03 .cs_project_card_text h6{ display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 1; width: 270px; box-sizing: border-box; } #home_04 .cs_modern_needs.cs_style{ justify-content: normal; width: 100%;} #map br.br_text{ display: none;} /*portfolio*/ .open-modal { display: flex; flex-direction: column; justify-content: flex-start; height: 403px;} .modal-content{ margin: 21% auto; width: 95%;} .logo-block.box { right: 35%;} .modal-content .info-block p{ margin-top: 10px;} .web-logo-box { display: flex; flex-direction: row !important; align-items: flex-start;} .cs_creative_protfolio_details .cs_project_card .cs_project_card_text { margin-top: 15px; margin-left: 0;} .cs_scrollup{bottom: 85px;} .close{ font-size: 38px;} #portfolio_01 .cs_creative_protfolio_menu ul { padding: 20px 0 0 0;} #portfolio_01 .cs_title { margin-bottom: 0;} .info-block.text { gap: 21px;} /*about*/ #about_01 .cs_funfact.cs_style1 .cs_funfact_text{ font-size: 22px;} #about_01 .cs_section_heading_text h4{ font-size: 28px;} #about_01 .align-items-center { padding: 30px 0 0;} .sub_i{ text-indent: -12px; margin-left: 12px;} #about_04.cs_shape_wrap_3 .cs_shape_2 { display: none;} /*value*/ #value_01 .cs_portfolio_details{padding: 25px 0;} #value_01.cs_shape_wrap_3 .cs_shape_1{top: 46%;} #value_02 .traditional .cs_section_title_4{ font-size: 26px;} #value_02 .new .cs_section_title_4{ font-size: 26px;} /*portfolios*/ /*contact*/ #map .cs_google_map { height: auto;} #map .seoul .address{ text-indent: -19px; margin-left: 36px;} } @media all and (min-width:992px) and (max-width:1199px) { } @media (max-width: 991px) { .cs_section_heading.cs_style_1 .cs_section_title { font-size: 28px;} .sub_i { text-indent: -10px; margin-left: 10px;} .img_box{ margin-top: 20px;} /*index*/ #video.section-padding{ padding: 90px 0 0 0;} #video .cs_hero.cs_style2 { height: 475px;} #video .cs_hero_bg { height: 375px;} #home_01 .cs_section_heading.cs_style_1 .cs_section_subtitle { font-size: 25px;} #home_01 .cs_section_heading.cs_style_1 .cs_section_title {margin-bottom: 0;} .cs_section_heading_text.hidden h2 { font-size: 28px; margin-bottom: 0;} #home_02 .cs_modern_needs.cs_style {display: unset;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 { flex-basis: 591px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text { top: 34%;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 .cs_stroke_text { font-size: 22px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_778 .cs_stroke_text h6 { font-size: 22px;} #home_02 .cs_btn.cs_style_1{margin: 20px 0;} .slide_item img{ margin-top: 20px;} .cs_img_card_text { top: 54%;} #home_02 .cs_section_heading_text { width: 100%;} #home_03 .modal-content{ margin: 25% auto;} #home_04 .cs_section_heading_text {width: 100%; } #home_04 .cs_text { padding: 0 31px 45px 0px;} /*about*/ #about_01 .text-end.one {margin-bottom: 18px;} #about_01 .cs_funfact.cs_style1{ margin-top: 10px;} #about_01 .align-items-center { padding: 25px 0 0;} #about_04 .cs_work.cs_work_1 .cs_card_work.cs_style_1 .cs_card.cs_style_1 .cs_posagation{display: none;} #about_04 .cs_card.cs_style_1 .cs_card_right_in { max-width: 510px;} #about_04 .title h2 { font-size: 25px;} /*value*/ #value_01.cs_shape_wrap_3 .cs_shape_1{ top: 55%;} #value_01 .col-lg-4.col-md-6.modules{ width: 100%;} #value_01 .col-lg-4.col-md-6.management{ width: 100%; margin-top: 20px;} #value_02 .unique { text-align: center; margin-bottom: 40px;} #value_02 .unique .cs_section_heading.cs_style_1.cs_type_1 .cs_section_heading_text{ max-width: 100%;} #value_02 .col-lg-7 .cs_section_heading_text h6 {font-size: 23px;} .card-text{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} /*#value_02 .traditional, #value_02 .new{margin-top: 40px;}*/ /*portfolios*/ #portfolio_01 .cs_title{ margin-bottom: 0px;} .open-modal { height: 430px;} #portfolio_01 .cs_section_heading_text p { font-size: 24px;} } @media (max-width: 768px) { .section-padding {padding: 40px 0;} #footer .f.container{ padding: 40px 0;} /*.no-js { overscroll-behavior: unset !important;}*/ /*index*/ #video .cs_hero_bg { height: 355px;} #video .cs_hero.cs_style2 { height: 445px;} .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ padding: 90px; width: 413px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text {top: 34%; left: -5%;} #about_04 .title h2{ margin: 35px 0 20px 0; padding-top: 0px;} .image-section .cs_img_section img {margin-top: 20px;} /*portfolio*/ .cs_project_card { margin-top: 25px;} .cs_creative_protfolio_details .cs_project_card .cs_project_card_text {margin-top: 10px;} .modal-content p { font-size: 14px;} .web-logo-box { flex-direction: column !important; } .info-block.text { gap: 17px;} /*contact*/ } @media (max-width: 720px) { /*index*/ #video .cs_hero.cs_style2 { height: 340px;} #video .cs_hero_bg {height: 268px; } #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text { top: 25%; width: 350px;} #home_03 .cs_section_heading.cs_style_1.cs_type_1{ flex-direction: column; align-content: space-between; align-items: flex-start;} .modal-content{ width: 95%;} .logo-block.box { right: 43%;} #about_04.cs_shape_wrap_3 .cs_shape_2{ left: 78%; bottom: 84%;} #value_02 .new .cs_section_title_4 { margin: 30px 0 10px 0;} #map .seoul { margin-top: 20px;} } @media (max-width: 575px) { /*index*/ #video .cs_hero.cs_style2 { height: 240px;} #video .cs_hero_bg { height: 177px;} #home_01 .cs_section_heading.cs_style_1 .cs_section_subtitle::before{top: 2px;} #home_01 .cs_moving_section.cs_stroke_text{font-size: 80px;} #home_01 .img_box{ margin-top:0;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ top: 25%; padding: 50px; width: 350px;} .cs_img_card_text { top: 53%; width: 100%;} .prev{ left: 0;} .next{ right: 0;} .prev, .next {color: #fff; text-shadow: 0px 0px #fff; top: 50%;} .prev:hover, .next:hover { color: #111; text-shadow: 0px 0px #111;} #home_03 .cs_section_heading.cs_style_1.cs_type_1 .cs_section_heading_right {margin-top: 0; text-align: left;} #home_03 .cs_slider_3 {padding: 25px 0;} #home_03 .modal-content { margin: 12% auto;} #home_04 .cs_text { padding: 0 31px 45px 0px;} /*about*/ .cs_accordeon .cs_accordion_item .cs_accordion_body{ padding: 30px 30px;} #about_03.cs_shape_wrap_3 .cs_shape_2{display: none;} .cs_card.cs_style_1 .cs_card_left{width:100%;} .cs_card.cs_style_1 { display: flex; position: relative; align-items: center; flex-wrap: wrap; flex-direction: column;} #about_04.cs_shape_wrap_3 .cs_shape_2 { display: none;} /*value*/ #value_01.cs_shape_wrap_3 .cs_shape_1{display: none;} #value_02 .new .cs_section_title_4 { margin: 10px;} #value_02 .unique { margin-bottom: 30px;} /*portfolios*/ .close{top: 20px; right: 20px;} .open-modal { height: auto;} .modal-header { flex-direction: column; justify-content: center; align-items: flex-start; height: 200px; padding: 10px 30px 10px 0;} .modal-header h2 { line-height: 1; padding: 10px 0; font-size: 30px;} .modal-info{flex-direction: column; align-items: flex-start;} .logo-block.box{position: relative; right: 0;} .web{ padding: 10px 0;} .web span.btn {margin-left: 0; margin-right: 16px;} .web a:nth-child(1) { order: 2;} .web a:nth-child(2) { order: 1;} .info-block{ padding: 0; margin-top:0;} .info-block.text{gap:0;} #modal-description-1 {padding: 10px 0;} .info-block:nth-child(1), .info-block:nth-child(2) {padding: 0;} .info-block.logo { padding: 0;} .modal-content {margin: 2% auto;} /*portfolio*/ #portfolio_01 .cs_creative_protfolio_menu ul { padding: 10px 0 0 0;} #portfolio_01 .cs_section_heading_text p { font-size: 22px;} #portfolio_01 .cs_creative_protfolio_details .cs_project_card .cs_project_card_text { margin-top: 10px; margin-left: 0;} .cs_project_card { margin-top: 25px;} .cs_project_card_img { aspect-ratio: 1 / 1; overflow: hidden; background: #f0f0f0; } .cs_project_card_img img{ width: 100%; height: 100%; object-fit: cover; } /*map*/ /*footer*/ .cs_footer_info {margin: 0 15px;} } @media (max-width: 480px) { .section-padding{ padding: 40px 0;} .cs_section_heading.cs_style_1 .cs_section_title{ font-size: 26px; line-height: 1.1; margin-bottom: 0px;} h2{ line-height: 2.1rem; letter-spacing: 0px;} p {font-size: 17px;} a {font-size: 17px;} /*.img_box{ padding: 25px 0 0 0;}*/ .cs_section_heading.cs_style_1 .cs_section_subtitle::before {top: 3px;} .cs_section_heading.cs_style_1.cs_type_1 .cs_section_heading_right{ margin-top: 0; text-align: left;} /*header*/ .cs_height_90 {height: 70px;} .cs_site_header.cs_style1 .cs_main_header_in{ height: 70px;} /*index*/ #video .cs_hero.cs_style2 {height: 276px;} #video.section-padding{ padding: 70px 0 0 0;} #home_01 .cs_section_heading.cs_style_1 .cs_section_subtitle { font-size: 20px;} #home_01 .cs_moving_section {padding: 25px 0px 0px 0px; font-size: 50px;} .cs_section_heading_text.hidden h2 { font-size: 20px;} #home_02 .step { padding: 25px 0;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ width: 300px; padding: 30px; top: 25%; left: -11px;} #home_02 .cs_btn.cs_style_1 {margin: 0;} .cs_section_heading.cs_style_1 .cs_section_title { font-size: 26px;} #home_03 .cs_slider_3{ padding: 25px 0 0 0; } #home_03 .modal-content { margin: 8% auto;} #home_04 .cs_text { padding: 0 0 25px 0px;} /*about*/ .cs_accordeon .cs_accordion_item .cs_accordion_body { padding: 30px;} #about_01 .full_img { margin-bottom: 25px;} #about_01 .text-end.one { margin-bottom: 0px;} #about_01 .align-items-center{ padding: 0;} #about_01 .cs_funfact.cs_style1 .cs_funfact_text p { font-size: 20px;} #about_01 .cs_funfact.cs_style1 .cs_funfact_number { line-height: 1.1;} #about_01 .cs_stroke_text { font-size: 45px;} #about_02 .img_box{ padding-bottom: 20px; margin-top: 20px;} #about_02 .cs_accordeon .cs_accordion_item { margin-bottom: 20px;} #about_02 .cs_accordeon .cs_accordion_item .cs_accordion_header svg{ width: 20px; height: 20px;} #about_03.cs_shape_wrap_3 .cs_shape_2 { left: 62%;} #about_03 .cs_slider_3 { padding: 25px 0 0 0;} #about_03.cs_shape_wrap_3 .cs_shape_2{display: none;} #about_03 .cs_shape_wrap_3 .cs_shape_2 svg{display: none;} #about_03 .cs_post.cs_style_2 .cs_post_info .num a{ font-size: 35px;} #about_04 .cs_card.cs_style_1 { flex-direction: column; align-items: start;} #about_04 .cs_card.cs_style_1 .cs_card_right{ padding: 25px 0;} #about_04 .cs_card_right .cs_card_right_in h2{ font-weight: 700;} #about_04 .title h2 {font-size: 22px;} /*value*/ #value_01 .cs_portfolio_details {padding: 0; } #value_01.cs_shape_wrap_3 .cs_shape_1{ display:none;} #value_01 .col-lg-4.col-md-12.title .cs_section_title {font-size: 25px;} #value_01 .modules { padding: 25px 0 0 0;} #value_02 .cs_section_title_4{font-size: 24px;} #value_02 .cs_section_heading.cs_style_1.cs_type_1 .cs_section_heading_text{max-width: 100%;} #value_02 .col-lg-7 .cs_section_heading_text h6 { font-size: 22px; margin-bottom: 0;} #value_02 .traditional, #value_02 .new{margin-top: 20px;} #modal-description-1{ padding: 20px 0;} #modal-description-2{ padding: 20px 0;} #modal-description-3{ padding: 20px 0;} #portfolio_01 ul { display: flex; flex-wrap: wrap; padding: 0; margin: 0;} #portfolio_01 .cs_creative_protfolio_details .cs_project_card .cs_project_card_text {margin-top: 5px; margin-left: 0;} #portfolio_01 .cs_creative_protfolio_details .cs_project_card .cs_project_card_text .cs_subtitle { margin-bottom: 0;} #portfolio_01 .cs_project_card:nth-child(n+2){ margin-top: 35px;} .info-block.logo { padding: 0;} .info-block.text { margin-bottom: 10px;} .modal-content {overflow-y: scroll; max-height: 610px} /*map*/ #map .cs_section_title_4{font-size: 20px;} #map .hongkong .address { text-indent: -15px; margin-left: 30px; } #map .cs_section_heading.cs_style_1 .cs_section_title {margin-bottom: 0;} #map .cs_google_map{ padding: 25px 0 0 0;} #map .cs_icon .cs_icon_text .cs_icon_subtitle {margin-bottom: 0;} #map .seoul { margin-top: 0px;} /*footer*/ #footer .cs_copyright {padding: 10px 0;} #footer .f.container{ padding: 40px 0;} } @media (max-width: 430px ) { .cs_img_card_text {top: 55%; padding: 12px; height: 167px;} } @media (max-width: 420px) { /*portfolio*/ .modal-content{ margin: 10% auto;} } @media (max-width: 390px) { .cs_section_heading.cs_style_1 .cs_section_title{ margin-bottom: 20px;} #about_01 .cs_section_heading_text h4 { font-size: 22px;} #home_03 .modal-content{ margin: 19% auto;} .web-logo-box img { max-width: 90px;} #portfolio_01 .cs_project_card:nth-child(n+2){ margin-top: 30px;} #about_02 .img_box{ margin-top: 0;} } @media (max-width: 375px) { p {font-size: 17px;} a {font-size: 17px;} .cs_section_heading.cs_style_1 .cs_section_subtitle::before{ width: 10px; height: 10px;} .cs_section_heading.cs_style_1 .cs_section_title { font-size: 22px; line-height: 1.1;} /*index*/ #video .cs_hero_bg { height: 170px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ top: 25%;} .cs_btn.cs_style_1 {padding: 15px 0; padding-left: 17px;} .cs_btn.cs_style_1::before {width: 50px; height: 50px;} .cs_section_heading_text.hidden h2 { font-size: 18px;} .cs_img_card_text { top: 51%;} .prev, .next { top: 43%;} /*about*/ #about_02 .cs_section_heading.cs_style_1 .cs_section_title_4{font-size: 24px; } #about_04 .cs_stroke_number{margin-top: 0;} #about_04 .title h2 { font-size: 20px;} /*value*/ #value_01 .col-lg-4.col-md-12.title .cs_section_title {font-size: 21px;} /*portfolios*/ /*.modal-content{margin: 9% auto; }*/ .modal-content {margin: 10% auto; overflow-y: scroll; max-height: 520px;} #portfolio_01 .cs_section_heading_text p{ font-size: 18px;} #portfolio_01 .cs_creative_protfolio_menu ul li { font-size: 16px;} #modal-description-1{ padding: 20px 0;} .info-block{ padding: 0;} } @media (max-width: 360px) { /*index*/ #video .cs_hero.cs_style2 { height: 253px;} #video .cs_hero_bg { height: 158px;} #home_01 .cs_section_heading.cs_style_1 .cs_section_subtitle { font-size: 18px; } #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text {width: 260px;} .cs_section_heading.cs_style_1 .cs_section_title{margin-bottom: 20px;} .cs_img_card_text { top: 55%; padding: 15px; height: 148px;} /*about*/ #about_02 .d-flex {padding-bottom: 25px;} #about_03.cs_shape_wrap_3 .cs_shape_2 { left: 70%; bottom: 59%;} #about_03.cs_shape_wrap_3 .cs_shape_2 svg { width: 100px; height: 100px;} #about_03 .cs_post.cs_style_2 .cs_post_info { padding: 40px;} /*value*/ #value_02 .col-lg-7 .cs_section_heading_text h6 { font-size: 20px; margin-bottom: 0;} /*portfolios*/ #home_03 .modal-content{ margin: 16% auto;} #map .seoul {margin-top: 0;} } @media (max-width: 344px) { /*index*/ /*#video .cs_hero_bg { height: 18vh;} #video .cs_hero.cs_style2{ min-height: 23vh;}*/ #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ top: 17%;} .cs_img_card_text { top: 50%; height: 155px;} } @media (max-width: 320px) { p {font-size: 15px;} a {font-size: 15px;} /*index*/ #video .cs_hero.cs_style2 { height: 240px;} #video .cs_hero_bg { height: 148px;} #home_02 .cs_modern_needs.cs_style .cs_col_md_672 .cs_img_section .cs_img_card_text{ width: 260px;} .cs_img_card_text { top: 49%;} /*about*/ .cs_accordeon .cs_accordion_item .cs_accordion_header{padding: 15px 15px;} /*value*/ #value_01 .col-12.workstream{margin-top: 24px;} /*portfolio*/ #home_03 .modal-content { margin: 10% auto;} .web-logo-box img { max-width: 80px;} /*contact*/ #map .cs_icon .cs_icon_text .cs_icon_subtitle {font-size: 15px;} #map .cs_google_map.cs_bg.seoul img { margin-top: 0px;} #map .seoul {margin-top: 10px;} }