@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css');
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Sans:ital,wght@0,100..800;1,100..800&display=swap');

*{box-sizing: border-box;padding: 0;margin: 0;font-family: "Poppins", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;
/*font-family:'Pretendard Variable' !important;*/}
.fa{font: normal normal normal 14px / 1 FontAwesome !important;}
a{text-decoration: none;}
ul{list-style: none;}
button{background-color: transparent; cursor: pointer;border: none;outline: none;}
img{border:0; display:block;}
h1, h2, h3, h4, h5, h6{padding:0;margin:0}
p{padding:0;margin:0;}
input{border: none;box-shadow: none;}
input:focus{outline: none;}
#theme-controller .fixed-top{z-index: 999999;}
.modal{z-index: 999999;}
.nt-container{max-width: unset !important;width: 100%;}
/* head 시작 */
#nt_header{background: unset; position: fixed; top: 0; left: 0; width: 100%; height: fit-content;z-index: 999998;}
#nt_menu{box-shadow: none !important;}
#nt_menu .nt-container{padding:20px 40px;}
#nt_menu .me-li.on .me-a, #nt_menu .me-li:hover .me-a{background: unset !important;}
#nt_menu .nt-container>div{align-items: center;justify-content: space-between;}
#nt_menu .nt-container>div .me-list{display: none;position: absolute; width: 100%; max-width: unset; height: 100vh; top: 0; left: 0; background: #0b0b12 !important; padding-top: 100px;}
#nt_menu .nt-container>div .me-list ul{justify-content: space-between;}
#nt_menu .nt-container>div .me-list ul li{width: 100%;flex-grow: unset;flex-basis:unset;display: flex; justify-content: center; align-items: center;flex-flow: row wrap;}
#nt_menu .nt-container>div .me-list ul li>b{height: 15vh;line-height: 15vh;font-size: 100px;font-weight: bold;padding: 0 !important;opacity: 0.5;transition: 0.3s;color: #fff;display: block;text-align: center;cursor: pointer;width: fit-content;margin: 0;}
#nt_menu .nt-container>div .me-list ul li .toggle_btn{display: block; color: #fff; height: 15vh; line-height: 15vh; width: 100px; text-align: center;font-size: 40px;opacity: 0.5;cursor: pointer;}
/* #nt_menu .nt-container>div .me-list ul li .sub_menu{display: none;height: calc(15vh * 4.7);width: 100%;} */
#nt_menu .nt-container>div .me-list ul li .sub_menu{display: none;width: 100%;margin-bottom:5vh}
#nt_menu .nt-container>div .me-list ul li .sub_menu p{font-size: 70px;line-height: unset;font-weight: 600;opacity: 0.5;transition: 0.3s;color: #fff;cursor: pointer;height: 16.666666%;display: flex;align-items: center;justify-items: center;width: 100%;text-align: center;justify-content: center;}
#nt_menu .nt-container>div .me-list ul li .sub_menu p img{display: block;height: 50%;}
#nt_menu .nt-container>div .me-icon{width: fit-content;height: fit-content;}
#nt_menu .nt-container>div .me-icon a img#logo_img{width: 170px;}
#nt_menu .nt-container>div .me-icon a span{color: #fff; display: block; width: fit-content; font-size: 15px; font-weight: 500; margin-right: 10px;}
#nt_menu .nt-container>div .me-icon.menu_bars{display: block;}
/* #nt_menu .nt-container>div .me-icon.menu_bars a{height: 60px;width: 60px; line-height: 25px; padding: 20px;position: relative;top: 0;left: 0;display: block;} */
#nt_menu .nt-container>div .me-icon.menu_bars a{line-height: 25px; padding: 20px;position: relative;top: 0;left: 0;display: block;}
#nt_menu .nt-container>div .me-icon.menu_bars a i{font-size: 35px !important;color: #fff;position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);transition: 0.1s;}
#nt_menu .nt-container>div .me-icon.menu_bars a i.fa-bars{opacity: 1;}
#nt_menu .nt-container>div .me-icon.menu_bars a i.fa-close{opacity: 0;}
#nt_menu .nt-container>div .me-icon.menu_bars a.atv i.fa-bars{opacity: 0;}
#nt_menu .nt-container>div .me-icon.menu_bars a.atv i.fa-close{opacity: 1;;}
#nt_menu .nt-container>div .me-list ul li.down_menu{margin-top: 10vh;}
#nt_menu .nt-container>div .me-list ul li.down_menu a{height: 10vh;line-height: 10vh;}
#nt_menu .nt-container>div .me-list ul li.down_menu a span{width: fit-content;margin: 0 auto; text-align: center; padding:0 140px 0 50px !important;position: relative;top: 0;left: 0;border-radius: 200px;border: 1px solid #fff;font-size: 40px;font-weight: bold;opacity: 0.5;transition: 0.3s;color: #fff;}
#nt_menu .nt-container>div .me-list ul li.down_menu a:hover span{opacity: 1;}
#nt_menu .nt-container>div .me-list ul li.down_menu a span img{position: absolute;right: 50px;top: 50%;transform: translateY(-50%);height: 40px;}
html.atv{overflow: hidden;}
@media screen and (max-width:1100px){
    #nt_menu .nt-container>div .me-list ul li .sub_menu p{font-size: 60px;}
}

@media screen and (max-width:900px){
    #nt_menu .nt-container{ padding: 0 !important;}
    #nt_menu .nt-container>div .me-icon a{padding: 20px;}
    #nt_menu .nt-container>div .me-icon.menu_bars a i{font-size: 20px !important;}
    #nt_menu .nt-container>div .me-list{padding-top: 76px;}
    #nt_menu .nt-container>div .me-list ul li>b{font-size: 70px;}
    #nt_menu .nt-container>div .me-list ul li .sub_menu p{font-size: 50px;}
    #nt_menu .nt-container>div .me-list ul li .sub_menu p img{height: 40%;}
    #nt_menu .nt-container>div .me-icon a img#logo_img{width: 100px;}
    #nt_menu .nt-container>div .me-list ul li.down_menu a span{padding:0 100px 0 30px !important;font-size: 25px}
    #nt_menu .nt-container>div .me-list ul li.down_menu a span img{right: 30px;height: 30px;}
}
@media screen and (max-width:800px){
    #nt_menu .nt-container>div .me-list ul li .sub_menu p{font-size: 40px;}
}
@media screen and (max-width:650px){
    #nt_menu .nt-container>div .me-list ul li>b{font-size: 50px}
    #nt_menu .nt-container>div .me-list ul li .sub_menu p{font-size: 36px; word-break: keep-all; line-height: 35px;}
    #nt_menu .nt-container>div .me-list ul li .sub_menu p img{height: 30%;}
    #nt_menu .nt-container>div .me-list ul li.down_menu a span{font-size: 17px;font-weight: normal;padding: 0 70px 0 30px !important;}
    #nt_menu .nt-container>div .me-list ul li.down_menu a span img{height: 20px;}
}
@media screen and (min-width:501px){
    #nt_menu .nt-container>div .me-list ul li>b:hover{opacity: 1;}
    #nt_menu .nt-container>div .me-list ul li>b:hover ~.toggle_btn{opacity: 1;}
    #nt_menu .nt-container>div .me-list ul li .sub_menu p:hover{opacity: 1;}
    #nt_menu .nt-container>div .me-list ul li>b.toggle:hover ~.sub_menu{display: block;}
    #nt_menu .nt-container>div .me-list ul li>.toggle_btn:hover ~.sub_menu{display: block;}
    #nt_menu .nt-container>div .me-list ul li .sub_menu:hover{display: block;}
    #nt_menu .nt-container>div .me-list ul li.sub_wrap:hover b{opacity: 1;}
    #nt_menu .nt-container>div .me-list ul li.sub_wrap:hover .toggle_btn{opacity: 1;}
}
@media screen and (max-width:500px){
    #nt_menu .nt-container>div .me-list ul li{justify-content: space-between;}
    #nt_menu .nt-container>div .me-list ul li .toggle_btn{font-size: 20px;}
    #nt_menu .nt-container>div .me-list ul li.down_menu{display: block;}
    #nt_menu .nt-container>div .me-list ul li>b{ width: 100%; text-align: left; padding-left: 20px !important; }
    #nt_menu .nt-container>div .me-list ul li.sub_wrap>b{width: calc(100% - 100px);}
    #nt_menu .nt-container>div .me-list ul li .sub_menu p{justify-content: flex-start;padding-left: 20px;text-align: left;}
    #nt_menu .nt-container>div .me-list ul li.hid.nn{opacity: 0;pointer-events: none;transition: 0.5s;}
}
/* head 끝 */


/* footer 시작 */
#nt_footer{}
#nt_footer .wrap{width: calc(100% - 40px);max-width: 1600px;margin: 0 auto;padding: 50px 0 175px;}
#nt_footer .wrap>p{color: #fff; font-size: 90px; font-weight: 600; line-height: 100px;border-bottom: 2px solid #fff; word-break: keep-all;}
#nt_footer .wrap>p span{color: #0034cf; display: block;}
#nt_footer .wrap>div{display: flex;justify-content: space-between;align-items: center; margin-bottom: 30px;}
#nt_footer .wrap>div span{color: #fff;font-size: 15px; font-weight: 500;}
#nt_footer .wrap>div span i{}
#nt_footer .wrap>div span.privacy_btn{margin-left: 20px;cursor: pointer;}
#nt_footer .wrap>div p{color: #fff;display: flex;justify-content: space-between;align-items: center;font-size: 15px; line-height: 50px;width: fit-content;cursor: pointer;}
#nt_footer .wrap>div p img{height: 12px; margin-left: 10px;}
#nt_footer .wrap>ul {flex-flow: row wrap;max-width: 550px;}
#nt_footer .wrap>ul li{position: relative;top: 0;left: 0;padding-right: 15px;margin-right: 15px;}
#nt_footer .wrap>ul li:nth-child(4),
#nt_footer .wrap>ul li:nth-child(5),
#nt_footer .wrap>ul li:last-child{width: 100%;}
#nt_footer .wrap>ul li:nth-child(3)::before,
#nt_footer .wrap>ul li:nth-child(4)::before,
#nt_footer .wrap>ul li:nth-child(5)::before,
#nt_footer .wrap>ul li:nth-child(6)::before,
#nt_footer .wrap>ul li:last-child::before{display: none;}
#nt_footer .wrap>ul li::before{content:"";width: 1px;height: 50%;background: #818181; position: absolute;right: 0;top: 50%;transform: translateY(-50%);}
#nt_footer .wrap>ul li p{color: #818181;}
#nt_footer .wrap>ul li p b{}
#tail_floating{position: fixed;bottom: 50px;right: 50px;z-index: 999998;cursor: pointer;}
#tail_floating::after{position: absolute; content: "→"; display: block; color: #fff; font-size: 30px; left: 50%; top: 50%; font-weight: 200; transform: translate(-50%, -50%) rotate(0deg);transition: 0.5s;}
#tail_floating:hover::after{ transform: translate(-50%, -50%) rotate(360deg);}
#tail_floating .rounded-text {width: 150px;height: 150px;text-transform: uppercase;transform: rotate(360deg);color: #fff;font-weight: bold;z-index: -1;}
@keyframes floating_rotating {
    from {
        transform: rotate(-360deg);
    }
    to {
        transform: rotate(0deg);
    }
}
#tail_floating .rotating {animation: floating_rotating 15s linear infinite;}
textPath.coloring {fill: #fff;font-size: 27px;font-weight: 200;}
.privacy_con{ display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 40px); max-width: 1200px; height: calc(100% - 40px); max-height: 600px; z-index: 999999;background: #fff;}
.privacy_con .top{height: 70px; width: 100%; background: #0034cf; text-align: center;position: relative;top: 0;left: 0;}
.privacy_con .top p{line-height: 70px;color: #fff;font-size: 20px; font-weight: bold;}
.privacy_con .top span{position: absolute;top: 0;right: 0;height: 100%;width: auto;aspect-ratio: auto 1 / 1;cursor: pointer;}
.privacy_con .top span::after{width: 2px;height:50%;content:"";display: block;background: #fff;transform: translate(-50%, -50%) rotate(45deg);top: 50%;left: 50%;position: absolute;}
.privacy_con .top span::before{width: 2px;height:50%;content:"";display: block;background: #fff;transform: translate(-50%, -50%) rotate(-45deg);top: 50%;left: 50%;position: absolute;}
.privacy_con #privacy{border: 1px solid #eeeeee; width: calc(100% - 140px); height: calc(100% - 210px); overflow-y: auto; margin: 70px auto 0; padding: 20px;}
.privacy_con #privacy>b{display: block; margin-bottom: 20px; word-break: keep-all; font-size: 17px; color: #000000;}
.privacy_con #privacy>.list{}
.privacy_con #privacy>.list li{display: flex; align-items: flex-start; line-height: 22px;margin-bottom: 10px;}
.privacy_con #privacy>.list li span{display: block;word-break: keep-all;margin-right: 10px; color: #666666;font-size: 17px;}
.privacy_con #privacy>.list li p{display: block;word-break: keep-all; color: #666666;font-size: 17px;}
.privacy_con #privacy>.list_con{margin-top: 100px;}
.privacy_con #privacy>.list_con li{margin-bottom: 50px;}
.privacy_con #privacy>.list_con li:last-child{margin-bottom:0px;}
.privacy_con #privacy>.list_con li>b{word-break: keep-all;display: flex; align-items: flex-start; line-height: 22px; margin-bottom: 10px;font-size: 20px;}
.privacy_con #privacy>.list_con li>b span{display: block;word-break: keep-all;margin-right: 10px;}
.privacy_con #privacy>.list_con li p{display: block; word-break: keep-all; color: #000; font-weight: 500; font-size: 17px;margin-bottom: 10px;line-height: 20px;}
.privacy_con #privacy>.list_con li>span{display: block;word-break: keep-all; color: #666666; font-size: 15px;margin-bottom: 10px;}
.privacy_con #privacy .date_wrap{margin-top: 100px;}
.privacy_con #privacy .date_wrap p{display: block;word-break: keep-all;font-size: 15px;font-size: 500;color: #000;}


@media screen and (max-width:1200px){
    #nt_footer .wrap>p{font-size: 70px; line-height: 80px;}
    #nt_footer .wrap>div{margin-bottom: 20px;}
    .privacy_con #privacy{ width: calc(100% - 70px); height: calc(100% - 140px); margin: 35px auto 0;}
}
@media screen and (max-width:900px){
    #nt_footer .wrap{padding: 50px 0;}
    #nt_footer .wrap>p { font-size: 50px; line-height: 60px;padding-bottom: 10px;}
    #tail_floating{bottom: 20px;right: 20px;}
    #tail_floating::after{font-size: 20px;}
    #tail_floating .rounded-text {width: 70px;height: 70px;}
    .privacy_con .top{height: 50px;}
    .privacy_con .top p{line-height: 50px;font-size: 17px;}
    .privacy_con #privacy>b{font-size: 15px;}
    .privacy_con #privacy>.list li span{font-size: 15px;}
    .privacy_con #privacy>.list li p{font-size: 15px;}
    .privacy_con #privacy>.list_con li>b{font-size: 17px;}
    .privacy_con #privacy>.list_con li p{font-size: 15px;}
    .privacy_con #privacy>.list_con li>span{font-size: 13px;}
}
@media screen and (max-width:600px){
    #nt_footer .wrap>p {font-size: 40px; line-height: 45px;}
    #nt_footer .wrap>ul {max-width: unset;}
    #nt_footer .wrap>ul li{width: 100%;padding-right: 0; margin-right: 0;margin-bottom: 10px;}
    #nt_footer .wrap>ul li:nth-child(1)::before,
    #nt_footer .wrap>ul li:nth-child(2)::before,
    #nt_footer .wrap>ul li:nth-child(5)::before,
    #nt_footer .wrap>ul li:nth-child(7)::before{display: none;}
    #nt_footer .wrap>ul li:last-child{padding-right: 0; margin-right: 0; width: 100%; text-align: center; margin-top: 50px;}
    #nt_footer .wrap>ul li:last-child::before{display: none;}
    #nt_footer .wrap>ul li p{line-height: 20px;word-break: keep-all;}
    #nt_footer .wrap>div{margin-top: 10px;align-items: flex-start;}
    #nt_footer .wrap>div>div{display: flex; flex-flow: column; justify-content: flex-start;}
    #nt_footer .wrap>div span{line-height: 30px;}
    #nt_footer .wrap>div span.privacy_btn{margin-left: 0;}
    .privacy_con #privacy{width: 100%; height: calc(100% - 40px); margin: 0 auto; border: unset;}
}
@media screen and (max-width:500px){
    #nt_footer .wrap>p {font-size: 30px; line-height: 35px;}
}

/* footer 끝 */



/* 메인 시작 */
#main_index{overflow:hidden;}
#main_index .main_movie{width: 100%;height: 100vh;position: relative;top: 0;left: 0;overflow: hidden;}
#main_index .main_movie video{height: 120%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
#main_index .main_movie .text{color: #fff;width: calc(100% - 40px);position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;}
#main_index .main_movie .text b{font-size: 100px;display: block;}
#main_index .main_movie .text p{font-size: 20px;}
#main_index .we_are{margin-top: 200px;}
#main_index .we_are p{font-size: 8vw;color: #fff;width: 100%;text-align: center; animation: neon1 1.5s ease-in-out infinite alternate;font-weight: 500;}

@keyframes neon1 {
    from {
        text-shadow: 0 0 4px #fff, 0 0 8px #fff, 0 0 10px #fff, 0 0 15px #0034cf,
        0 0 30px #0034cf, 0 0 40px #0034cf, 0 0 50px #0034cf, 0 0 60px #0034cf;
    }
    to {
        text-shadow: 0 0 2px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 7.5px #0034cf,
        0 0 15px #0034cf, 0 0 20px #0034cf, 0 0 25px #0034cf, 0 0 30px #0034cf;
    }
}

#main_index .main_business{position: relative;top: 0;left: 0;width: 100%;}
#main_index .main_business::after{content: ""; width: 80%; height: 125%; background-image: url(/../../img/main_bg3.png); background-size: cover; background-repeat: no-repeat; position: absolute; display: block; background-position: center; top: 35%; left: 0;z-index: 0;}
#main_index .main_business .wrap{width:100%;max-width: 1600px;margin: 200px auto;padding: 0 20px; transform-origin: top right;position: relative;z-index: 2;}
#main_index .main_business .wrap>b{color: #fff;font-size: 65px;display: block;text-align: center;font-weight: 500;margin-bottom: 50px;}
#main_index .main_business .wrap ul{justify-content: space-evenly;align-items: flex-start;flex-flow: row wrap;}
#main_index .main_business .wrap ul li{width: 33.333333%;}
#main_index .main_business .wrap ul li:nth-child(2){padding-top: 70px;}
#main_index .main_business .wrap ul li img{width: 150px;margin: 0 auto 50px;animation: floating_rotating 15s linear infinite;}
#main_index .main_business .wrap ul li b{color: #fff;font-size: 40px;display: block;text-align: center; line-height: 50px;max-width: 300px;margin: 0 auto 20px; word-break: keep-all;}
#main_index .main_business .wrap ul li span{color: rgb(255 255 255 / 50%); font-size: 20px; text-align: center; display: block; width: 100%; word-break: keep-all;margin: 0 auto;font-weight: 300;}
#main_index .main_business .wrap ul li span.mo{display: none;}
#main_index .main_business .wrap ul li>a{display: block;width: 100%; max-width: 160px;margin: 20px auto 0;font-size: 22px;height: 42px;line-height: 40px;}
#main_index .main_portfolio{}
#main_index .main_portfolio .wrap{width: calc(100% - 40px);max-width: 1600px;margin: 200px auto 0;}
#main_index .main_portfolio .wrap>b{color: #fff; font-size: 65px; display: block; text-align: center; font-weight: 500; margin-bottom: 50px;}
#main_index .main_portfolio .wrap .ul_wrap{justify-content: space-between;gap: 80px;flex-flow: row wrap;align-items: center;}
#main_index .main_portfolio .wrap .ul_wrap ul{width: calc(50% - 40px);flex-flow: column;}
#main_index .main_portfolio .wrap .ul_wrap ul li{margin-bottom: 150px;height: fit-content;}
#main_index .main_portfolio .wrap .ul_wrap ul li:last-child{margin-bottom: 0px;}
#main_index .main_portfolio .wrap .ul_wrap ul li img{width: 100%;filter: brightness(0.5) grayscale(1);transition: 0.5s;}
#main_index .main_portfolio .wrap .ul_wrap ul li:hover img{filter: unset;}
#main_index .main_portfolio .wrap .ul_wrap ul li:hover a{color: #000;}
#main_index .main_portfolio .wrap .ul_wrap ul li b{color: #fff; display: block; text-align: left; font-size: 30px; margin-top: 20px; font-weight: 400;}
#main_index .main_portfolio .wrap .ul_wrap ul li a{color: #fff;position: absolute;bottom: 20px;left: 20px;font-size: 60px;transition: 0.3s;line-height: 70px;font-weight: 500;}
#main_index .main_portfolio .wrap .ul_wrap ul li a.mo{display: none;}
#main_index .main_portfolio .wrap .ul_wrap ul.left{}
#main_index .main_portfolio .wrap .ul_wrap ul.left b{text-align: right;}
#main_index .main_portfolio .wrap .ul_wrap ul.right li:last-child{position: relative;top: 0;left: 0;}
#main_index .main_portfolio .wrap .ul_wrap ul.right li:last-child:hover img{filter: blur(3px) opacity(0.5);}
#main_index .together{width: 100%;height:fit-content;margin: 200px auto 0; max-width: 1600px;z-index: 1;position: relative;}
#main_index .together .text{padding: 125px;width: 100%;background-image: url(/../../img/together_bg.png);background-size: cover;background-repeat: no-repeat;background-position: center;}
#main_index .together .text b{display: block; color: #fff; font-size: 80px; font-weight: 500; max-width: 880px; margin: 0 0 50px; line-height: 90px;}
#main_index .together .text a{display: block;max-width: 240px;margin: 0;font-size: 22px;}
@media screen and (max-width:1600px){
    #main_index .main_business::after{display: none;}
    #main_index .main_portfolio .wrap .ul_wrap{gap: 20px;}
    #main_index .main_portfolio .wrap .ul_wrap ul{width: calc(50% - 10px);}
}
@media screen and (max-width:1530px){
    #main_index .main_business .wrap ul li span.pc{display: none;}
    #main_index .main_business .wrap ul li span.mo{display: block;width: 100%;}
}
@media screen and (max-width:1400px){
    #main_index .main_business .wrap>b{font-size: 55px;margin-bottom: 50px;}
    #main_index .main_business .wrap ul li b{font-size: 30px; line-height: 40px; max-width: 222px;}
    #main_index .main_business .wrap ul li span{font-size: 17px;max-width: 377px;}
    #main_index .main_portfolio .wrap>b{font-size: 55px;margin-bottom: 50px;}
}
@media screen and (max-width:1200px){
    #main_index .we_are p{font-size: 60px}
    #main_index .main_business .wrap{scale: 1;}
    #main_index .main_business .wrap ul li img{margin: 0 auto 30px;}
    #main_index .main_business .wrap ul li b{font-size: 25px; line-height: 35px;max-width: 185px;}
    #main_index .main_business .wrap ul li span{font-size: 17px;max-width: 321px;}
    #main_index .main_portfolio .wrap{margin: 100px auto 0;}
    #main_index .main_portfolio .wrap .ul_wrap ul li img{filter: unset !important;}
    #main_index .main_portfolio .wrap .ul_wrap ul li a.pc{display: none;}
    #main_index .main_portfolio .wrap .ul_wrap ul li a.mo{display: flex;justify-content: center;align-items: center; position: unset;font-size: 22px !important;line-height: unset;margin-top: 20px;}
    #main_index .main_portfolio .wrap .ul_wrap ul li:hover a{color: #fff;}
    #main_index .together .text {padding: 80px;}
    #main_index .together .text b{ font-size: 50px; max-width: 550px; line-height: 50px;opacity: 1 !important;}
}
@media screen and (max-width:900px){
    #main_index .main_business::after{ width: 200%; height: 120%; top: -195px; }
    #main_index .main_business .wrap>b{font-size: 40px;margin-bottom: 50px;}
    #main_index .main_business .wrap ul li{width: 100%; width: 100%; display: flex; justify-content: flex-start; flex-flow: row wrap;margin-bottom: 100px;}
    #main_index .main_business .wrap ul li:last-child{margin-bottom:50px;}
    #main_index .main_business .wrap ul li img{margin: 0 auto 10px;width: 100px;}
    #main_index .main_business .wrap ul li b{font-size: 20px;line-height: 25px;max-width: unset;width: 100%;text-align: center;margin: 20px 0 20px;}
    #main_index .main_business .wrap ul li span{font-size: 17px;max-width: 377px;line-height: 22px;max-width: unset;width: 70%;text-align: center;}
    #main_index .main_business .wrap ul li:nth-child(2){padding-top: 0;}
    #main_index .main_business .wrap ul li>a{font-size: 17px;}
    #main_index .main_portfolio .wrap>b{font-size: 40px;margin-bottom: 50px;}
    #main_index .main_portfolio .wrap .ul_wrap ul{width: 100%; justify-content: center; flex-flow: row wrap;}
    #main_index .main_portfolio .wrap .ul_wrap ul.right{margin-top: 100px;}
    #main_index .main_portfolio .wrap .ul_wrap ul li{width: 100%; max-width: 600px;margin-bottom: 100px;}
}
@media screen and (max-width:800px){
    #main_index .we_are p{font-size: 50px;}
    #main_index .main_movie .text b{font-size: 80px;}
    #main_index .together .text{padding: 50px 20px;}
    #main_index .together .text b{font-size: 40px;line-height: 40px;max-width: 450px;}
}
@media screen and (max-width:600px){
    #main_index .main_movie .text b{font-size: 60px;}
    #main_index .main_portfolio .wrap .ul_wrap ul.right{margin-top: 50px;}
    #main_index .main_portfolio .wrap .ul_wrap ul li{margin-bottom: 50px;}
    #main_index .main_portfolio .wrap .ul_wrap ul li b{font-size: 20px;text-align: right;}
    #main_index .main_portfolio .wrap .ul_wrap ul li a{font-size: 20px !important;}
}
@media screen and (max-width:500px){
    #main_index .we_are p{font-size: 40px;}
    #main_index .main_movie .text b{font-size: 50px;}
    #main_index .main_business .wrap>b{font-size: 35px;}
    #main_index .main_business .wrap ul li{margin-bottom: 50px;}
    #main_index .main_business .wrap ul li span{width: 100%;}
    #main_index .main_business .wrap ul li img{margin: 0 auto 0;width: 70px;}
    #main_index .main_portfolio .wrap{margin:50px auto 0;}
    #main_index .main_portfolio .wrap>b{font-size: 35px;}
    #main_index .together .text{padding: 40px 20px;}
    #main_index .together .text b{font-size: 30px;margin: 0 auto 30px;line-height: 30px;max-width: 330px;text-align: center;}
    #main_index .together .text a{margin: 0 auto;}
}
@media screen and (max-width:390px){
    #main_index .we_are p{font-size: 30px;}
}

/* 메인 끝 */



/* business 시작 */
#business{}
#business.business_pc{display: block;}
#business.business_mo{display: none;}
#business .visual{}
#business .visual li{justify-content: space-between;align-items: center;margin-top: 250px;}
#business .visual li:first-child{margin-top: 80px;}
#business .visual li:nth-child(2n){flex-flow:row-reverse}
#business .visual li img{width: 57%;}
#business .visual li .text{width: 38%;justify-content: space-between;align-items: center;flex-flow: row wrap;padding: 0 20px 0 0;}
.ani_wrap{overflow: hidden;}
.ani_wrap.b_tag{margin-bottom: 200px;}
#business .visual li .text b{color: #fff;display: block;font-size: 50px;font-weight: 500;opacity: 0; transform: translateY(100%);}
#business .visual li .text p{color: #fff;display: block;font-size: 30px;font-weight: 600;opacity: 0; transform: translateY(100%);}
#business .visual li .text b.atv{animation:text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
#business .visual li .text p.atv{animation:text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
#business .visual li .text p span{display: block;font-size: 18px;color: rgb(255 255 255 / 50%);font-weight: 400;margin-top: 20px;width: 100%;max-width: 463px;    word-break: keep-all;}
#business .visual li:nth-child(2n) .text{justify-content:end;padding: 0 0 0 20px;}
#business .visual li:nth-child(2n) b{text-align: right;}
#business .visual li:nth-child(2n) p{text-align: right;}
@-webkit-keyframes text-active-animation {
    0% {
        opacity: 0;
        filter: Alpha(opacity = 0);
        transform: translateY(100%);
    }
    100% {
        opacity: 1.0;
        filter: Alpha(opacity = 100);
        transform: translateY(0);
    }
}
#business .subscription{width: calc(100% - 40px);margin: 340px auto 0;}
#business .subscription .sub_title b.one{color: #fff;word-break: keep-all; font-size: 50px;display: block;text-align: center;margin-bottom: 50px; font-weight: 600;}
#business .subscription .sub_title p.one{color: #fff;word-break: keep-all; font-size: 20px;display: block;text-align: center;line-height: 40px;font-weight: 300;}
#business .subscription .sub_title b.two{color: #fff;word-break: keep-all; font-size: 30px;display: block;text-align: center;margin-bottom: 30px; font-weight: 600;}
#business .subscription .sub_title p.two{color: #fff;word-break: keep-all; font-size: 18px;display: block;text-align: center;line-height: 40px;font-weight: 300;}
#business .subscription .sub_title .line{margin: 100px auto;width: 1px;height: 70px;background: #fff;}
#business .subscription .text_blind{filter: blur(7px);opacity: 0.1;}
#business .subscription .text_blind.atv{animation:text-blind 1s both;}
#business .subscription>ul{justify-content: space-between;flex-flow: row wrap;width: 100%;max-width: 1400px;margin: 120px auto 0;}
#business .subscription>ul li{width: 49%;max-width: 600px;margin-bottom: 170px;}
#business .subscription>ul li:nth-child(3),
#business .subscription>ul li:nth-child(4){margin-bottom: 0px;}
#business .subscription>ul li .img_wrap{width: 100%;margin-bottom: 60px;overflow: hidden;}
#business .subscription>ul li .img_wrap img{width: 100%;transition: 0.7s;}
#business .subscription>ul li .img_wrap img:hover{scale: 1.1;}
/* transform-origin: top right; */
#business .subscription>ul li p{color: #fff;display: block;word-break: keep-all; font-size: 30px;text-align: center;font-weight: 600;}
#business .subscription>ul li span{color: #fff;display: block;word-break: keep-all; font-size: 22px;text-align: center;font-weight: 300;}
#business .advantage{width: calc(100% - 40px);margin: 420px auto 0;max-width: 1600px;}
#business .advantage .text_blind{filter: blur(7px);opacity: 0.1;}
#business .advantage b.text_blind.atv{animation:text-blind 1s both;}
#business .advantage div.text_blind.atv{animation:text-blind 1s both;}
@-webkit-keyframes text-blind {
    0% {
        filter: blur(7px);
        opacity: 0.1;
    }
    100% {
        filter: blur(0px);
        opacity: 1;
    }
}
#business .advantage>b{color: #fff;word-break: keep-all; font-size: 50px;display: block;text-align: center;margin-bottom: 150px; font-weight: 600;}
#business .advantage>div{margin-bottom: 80px;}
#business .advantage>div:last-child{margin-bottom: 0px;}
#business .advantage>div span{word-break: keep-all; font-size: 35px;color: #3874FF;width: 65px;font-weight: 600;}
#business .advantage>div b{color: #fff;word-break: keep-all; font-size: 35px;display: block;width: calc(100% - 65px);font-weight: 500;}
#business .advantage>div b p{color: #fff;word-break: keep-all; font-size: 22px;display: block;font-weight: 300;margin-top: 20px;line-height: 40px;word-break: keep-all;}
#business .table{width: calc(100% - 40px);max-width: 1600px;margin: 300px auto 0;}
#business .table>p{color: #fff;display: block;word-break: keep-all; font-size: 30px;font-weight: 300;text-align: center;margin-bottom: 50px;}
#business .table>b{color: #fff;word-break: keep-all; font-size: 50px;display: block;text-align: center;font-weight: 600;margin-bottom: 50px;}
#business .table>ul{}
#business .table>ul li{border-bottom: 1px solid rgb(217 217 217 / 20%);}
#business .table>ul li:nth-child(1){width: 17%;}
#business .table>ul li:nth-child(2){width: 25%;}
#business .table>ul li:nth-child(3){width: 33%;}
#business .table>ul li:nth-child(4){width: 25%;}
#business .table>ul li:first-child p:first-child{border-top: 1px solid rgb(217 217 217 / 20%);}
#business .table>ul li p{color: #fff;word-break: keep-all; font-size: 22px;border-bottom: 1px solid rgb(217 217 217 / 20%);text-align: center;height: 70px;line-height: 70px;font-weight: 300;}
#business .table>ul li p:first-child{height: 100px;line-height: 97px;}
#business .table>ul li p:last-child{height: 76px;line-height: 76px;}
#business .table>ul li p.black{color: rgb(217 217 217 / 50%);}
#business .table>ul li p.black:last-child{border-bottom: 5px solid #0b0b12;}
#business .table>ul li p.black_gray{background:  #15151c}
#business .table>ul li p.black_gray:last-child{border-bottom: 5px solid #15151c;}
#business .table>ul li p.gray{background: #29292f;word-break: keep-all; font-size: 30px;border-top: 5px solid #29292f;font-weight: 600;}
#business .table>ul li.point{border: 5px solid #FFF;}
#business .table>ul li.point p{color: #fff;font-weight: 500;}
#business .table>ul li.point p:first-child{height:95px;}
#business .table>ul li.point p.black:last-child{border-bottom: none;}
#business .table>ul li.point p.gray{border-top: none;}
#business .table>ul li.point p:last-child{height: 70px;line-height: 70px;}
@media screen and (max-width:1660px){
    #business .visual li img{width: 50%;}
    #business .visual li .text{width: 46%;}
    .ani_wrap.b_tag {margin-bottom: 100px;}
}
@media screen and (max-width:1400px){
    #business .visual li .text b{font-size: 40px; line-height: 50px;}
    #business .visual li .text p{font-size: 25px;}
    #business .visual li .text p span{font-size: 18px;/*margin-top: 20px;*//*max-width: 450px;*/}
    #business .subscription{margin: 240px auto 0;}
    #business .subscription .sub_title b.one{font-size: 40px;margin-bottom: 40px;}
    #business .subscription .sub_title p.one{font-size: 18px; line-height: 36px;}
    #business .subscription .sub_title b.two{font-size: 25px;margin-bottom: 25px;}
    #business .subscription .sub_title p.two{font-size: 18px; line-height: 36px;}
    #business .subscription>ul li{margin-bottom: 130px;}
    #business .subscription>ul li .img_wrap{margin-bottom: 50px}
    #business .subscription>ul li p{font-size: 25px;}
    #business .subscription>ul li span{font-size: 20px;}
    #business .advantage{margin: 320px auto 0;}
    #business .advantage>b{font-size: 40px;margin-bottom: 130px;}
    #business .advantage>div span{font-size: 30px;width: 50px;}
    #business .advantage>div b{font-size: 30px;width: calc(100% - 50px);}
    #business .advantage>div b p{font-size: 20px;margin-top: 15px;line-height: 36px;}
    #business .table>p{font-size: 25px;margin-bottom: 40px;}
    #business .table>b{font-size: 40px;margin-bottom: 40px;}
    #business .table>ul li p{font-size: 20px;}
    #business .table>ul li p.gray{font-size: 25px;}
}

@media screen and (max-width:1200px){
    #business{}
    #business.business_pc{display: none;}
    #business.business_mo{display: block;}
    #business .visual li .text b{opacity: 1; transform: translateY(0);}
    #business .visual li .text p{opacity: 1; transform: translateY(0);}
    #business .visual li .text b.atv{animation:unset;}
    #business .visual li .text p.atv{animation:unset;}
    #business .subscription>ul li .img_wrap img:hover{scale: 1;}
    #business .subscription .text_blind{filter: unset;opacity: 1;}
    #business .subscription .text_blind.atv{animation:unset;}
    #business .subscription .sub_title .line{margin: 50px auto;height: 30px;}
    #business .advantage{margin: 200px auto 0;}
    #business .advantage .text_blind{filter: unset;opacity: 1;}
    #business .advantage b.text_blind.atv{animation:unset;}
    #business .advantage div.text_blind.atv{animation:unset;}
    #business .table{margin: 200px auto 0;}
    #business .table .ul_title{height: 95px; text-align: center; line-height: 95px; color: #fff; font-weight: 500; font-size: 25px; margin-top: 100px;background: #29292f;border-top:1px solid rgb(217 217 217 / 20%);}
    #business .table>ul li:nth-child(1){width: 40%;}
    #business .table>ul li:nth-child(2){width: 60%;}
    #business .table>ul li p.black:nth-child(1){border-top: 1px solid rgb(217 217 217 / 20%);height: 75px; line-height: 73px;}
    #business .table>ul li.point p:first-child{height: 70px;line-height: 68px;}
    #business .table>ul li p:first-child{height: 75px;line-height: 73px;}
}
@media screen and (max-width:1110px){
    #business .visual li .text b{font-size: 35px; line-height: 45px;}
    #business .visual li .text p{font-size: 20px;}
    #business .visual li .text p span{font-size: 15px;}
    .ani_wrap.b_tag {margin-bottom: 50px;}
    #business .subscription .sub_title b.one{font-size: 35px;margin-bottom: 30px;}
    #business .subscription .sub_title p.one{font-size: 15px; line-height: 30px;}
    #business .subscription .sub_title b.two{font-size: 20px;margin-bottom: 20px;}
    #business .subscription .sub_title p.two{font-size: 15px; line-height: 30px;}
    #business .subscription>ul li p{font-size: 20px;}
    #business .subscription>ul li span{font-size: 15px;}
    #business .advantage>b{font-size: 35px;margin-bottom: 100px;}
    #business .advantage>div b p{font-size: 15px;margin-top: 10px;line-height: 30px;}
    #business .table>p{font-size: 20px; margin-bottom: 30px;}
    #business .table>b{font-size: 35px;margin-bottom: 30px;}
    #business .table>ul li p{font-size: 15px;}
    #business .table>ul li p.gray{font-size: 20px;}
    #business .table .ul_title{font-size: 20px;height: 70px;line-height: 68px;}
}
@media screen and (max-width:950px){
    #business .visual li{flex-flow: row wrap !important;margin-top: 100px;}
    #business .visual li:first-child {margin-top: 0px;}
    #business .visual li img{width: 100%;}
    #business .visual li .text{width: 100%;padding: 20px 20px 0 !important;}
    .ani_wrap.b_tag {margin-bottom: 30px;}
    #business .visual li .text p span{margin-top: 5px;}
    #business .subscription .sub_title b.one{margin-bottom: 10;}
    #business .subscription .sub_title p.one{line-height: 25px;}
    #business .subscription .sub_title b.two{margin-bottom: 10px;}
    #business .subscription .sub_title p.two{line-height: 25px;}
    #business .subscription .sub_title .line{margin: 20px auto;}
    #business .subscription>ul{margin: 50px auto 0;}
    #business .subscription>ul li{width: 100%;margin: 0 auto 50px;}
    #business .subscription>ul li:nth-child(3){margin-bottom: 50px;}
    #business .subscription>ul li .img_wrap{margin-bottom: 20px;}
}
@media screen and (max-width:900px){
    #business .visual li{flex-flow: row wrap !important;margin-top: 100px;}
    #business .visual li:first-child {margin-top: 0px;}
    #business .visual li img{width: 100%;}
    #business .visual li .text{width: 100%;padding: 20px 20px 0 !important;}
    .ani_wrap.b_tag {margin-bottom: 30px;}
    #business .visual li .text p span{margin-top: 5px;}
}
@media screen and (max-width:500px){
    #business{}
    #business .visual li .text b {font-size: 30px;line-height: 40px;}
    #business .subscription .sub_title b.one{font-size: 30px;margin-bottom: 20px;line-height: 31px;}
    #business .subscription .sub_title b.two{font-size: 18px;margin-bottom: 20px;}
    #business .subscription .sub_title .line{height: 20px;}
    #business .advantage{margin: 150px auto 0;}
    #business .advantage>div span{line-height: 31px;}
    #business .advantage>b{font-size: 30px;margin-bottom: 50px;line-height: 31px;}
    #business .advantage>div b{font-size: 20px;}
    #business .table{margin: 150px auto 0;}
    #business .table>p{font-size: 15px;}
    #business .table>b{font-size: 30px;margin-bottom: 20px;line-height: 31px;}
    #business .table .ul_title{font-size: 17px;font-weight: 700;}
}
/* business 끝 */


/* business 하위메뉴 공통 */
.sub_bnr {background: linear-gradient(200deg, rgba(17, 52, 133, 0.6) 35%, rgba(0, 0, 0, 0.9) 65%); height: 100vh; overflow-x: hidden;}
.sub_bnr .title{position: relative; top: 50%; left: 0; transform: translateY(-50%); z-index: 2; padding-left: 160px;}
.sub_bnr .title h1{font-size: 100px; font-weight: 700; color: #fff; background: url('/img/solution_bg01.png')no-repeat center left; background-size: inherit; padding-top: 200px; line-height: 1;}
.sub_bnr .title h1 span{display: block; font-size: 35px; word-break: keep-all; margin-top: 30px;}
.sub_bnr .title p{font-size: 26px; font-weight: 400; color: #fff; line-height: 1.4; margin-top: 60px;}
.sub_bnr .shapeBox{position: absolute;top:0;left:0;width: 100%; height: 100vh; z-index: 1; overflow: hidden;}
.sub_bnr .shapeBox>div{position: absolute; background-size: contain; background-repeat: no-repeat;}
.sub_bnr .shapeBox .cube {background-image: url('/img/solution_img01.png'); animation: float 6s ease-in-out infinite; left:70%; top:50%; width:600px; height: 700px;}
.sub_bnr .shapeBox .cube_top{background-image: url('/img/solution_img04.png'); animation: float 6s ease-in-out infinite; left:20%; top:10%; width:75px; height: 90px; filter: blur(10px);}
.sub_bnr .shapeBox .cube_bot{background-image: url('/img/solution_img05.png'); animation: float 6s ease-in-out infinite; left:10%; top:85%; width:120px; height: 140px; filter: blur(20px);}
.sub_bnr .shapeBox .circle_left{background-image: url('/img/solution_img02.png');left:30%; top:-25%; animation : spring_top 5s infinite linear;transform-style: preserve-3d; width:700px; height: 700px;}
.sub_bnr .shapeBox .circle_right{background-image: url('/img/solution_img03.png');left:95%; top:75%; animation : spring_bot 5s infinite linear;transform-style: preserve-3d; width:700px; height: 700px;}
.contact_btn{text-align: center;color: #fff;width: calc(100% - 40px); max-width: 300px; margin:130px auto; display: block; height: 60px; line-height: 58px; font-size: 25px; font-weight: bold; box-shadow: unset; border: 1px solid rgb(255 255 255 / 60%) !important; background-color: rgb(0 0 0 / 10%) !important; border-radius: 50px;cursor: pointer;}
#business .contact_btn{margin:150px auto 0;}


/* seo */
#seo .sub_bnr .title h1{background: url('/img/seo_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px;}
#seo .sub_bnr .shapeBox .cube {background-image: url('/img/seo_img01.png'); animation: float 6s ease-in-out infinite; left:75%; top:60%; width:800px; height: 930px;}
#seo .sub_bnr .shapeBox .cube_top{background-image: url('/img/seo_img02.png'); animation: float 6s ease-in-out infinite; left:30%; top:5%; width:420px; height: 320px; filter: blur(20px);}
#seo .sub_bnr .shapeBox .cube_bot{background-image: url('/img/seo_img03.png'); animation: float 6s ease-in-out infinite; left:10%; top:85%; width:180px; height: 250px;}


/* marketing */
#marketing .sub_bnr .title h1{background: url('/img/marketing_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px;}
#marketing .sub_bnr .shapeBox .cube {background-image: url('/img/marketing_img01.png'); background-size: 100%; animation: float 6s ease-in-out infinite; left:75%; top:60%; width:645px; height: 950px; z-index: 2;}
#marketing .sub_bnr .shapeBox .circle_right{background-image: url('/img/marketing_img03.png');left:93%; top:80%; animation : spring_bot 5s infinite linear;transform-style: preserve-3d; width:180px; height: 590px;}
#marketing .sub_bnr .shapeBox .cube_top{background-image: url('/img/marketing_img02.png'); animation: float 6s ease-in-out infinite; left:35%; top:0%; width:1000px; height: 300px; filter: blur(10px);}
#marketing .sub_bnr .shapeBox .cube_bot{background-image: url('/img/marketing_img04.png'); animation: float 6s ease-in-out infinite; left:15%; top:85%; width:210px; height: 250px; filter: none;}


/* design */
#design .sub_bnr .title h1{background: url('/img/design_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px;}
#design .sub_bnr .shapeBox .cube {background-image: url('/img/design_img01.png'); background-size: 100%; animation: float 6s ease-in-out infinite; left:85%; top:50%; width:970px; height: 800px; z-index: 2;}
#design .sub_bnr .shapeBox .circle_right{background-image: url('/img/design_img02.png');left:65%; top:80%; animation : spring_bot 5s infinite linear;transform-style: preserve-3d; width:360px; height: 360px; z-index: 1;}
#design .sub_bnr .shapeBox .circle_left{background-image: url('/img/design_img03.png');  background-size: 100%; left:30%; top:-10%; animation : spring_top 5s infinite linear;transform-style: preserve-3d; width:735px; height: 670px;}
#design .sub_bnr .shapeBox .cube_top{background-image: url('/img/design_img04.png'); animation: float 6s ease-in-out infinite; left:5%; top:25%; width:50px; height: 50px; filter: none;}
#design .sub_bnr .shapeBox .cube_bot{background-image: url('/img/design_img05.png'); animation: float 6s ease-in-out infinite; left:10%; top:85%; width:130px; height: 130px; filter: none;}


/* website */
#website .sub_bnr .title h1{background: url('/img/website_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px;}
#website .sub_bnr .shapeBox .cube {background-image: url('/img/website_img01.png'); background-size: 100%; animation: float 6s ease-in-out infinite; left:75%; top:50%; width:670px; height: 670px; z-index: 2;}
#website .sub_bnr .shapeBox .circle_right{background-image: url('/img/website_img02.png');left:85%; top:55%; animation : spring_bot 5s infinite linear;transform-style: preserve-3d; width:410px; height: 540px; z-index: 1;}
#website .sub_bnr .shapeBox .cube_top{background-image: url('/img/website_img03.png'); animation: float 6s ease-in-out infinite; left:10%; top:25%; width:200px; height: 155px; filter: none;}
#website .sub_bnr .shapeBox .cube_bot{background-image: url('/img/website_img04.png'); animation: float 6s ease-in-out infinite; left:15%; top:85%; width:70px; height: 70px; filter: none;}



@keyframes float {
  0% {
  transform: translate(-50%, -50%) translateY(0);
  }
  50% {
  transform: translate(-50%, -50%) translateY(20px); /* 아래로 약간 이동 */
  }
  100% {
  transform: translate(-50%, -50%) translateY(0); /* 원래 위치로 돌아옴 */
  }
}
.sub_bnr .shapeBox .spring_top{background-image: url('/img/subbnr_img02.png'); animation: spring_top 6s ease-in-out infinite; left:95%; top:-15%; width:800px; height: 800px;}
.sub_bnr .shapeBox .spring_bot{background-image: url('/img/subbnr_img01.png'); animation: spring_bot 8s ease-in-out infinite; left:5%; top:95%; width:800px; height: 800px;}
@keyframes spring_top {
  0% {
  transform: translate(-50%, -50%) translateY(50px);
  }
  50% {
  transform: translate(-50%, -50%) translateY(20px); /* 아래로 약간 이동 */
  }
  100% {
  transform: translate(-50%, -50%) translateY(50px); /* 원래 위치로 돌아옴 */
  }
}
@keyframes spring_bot {
  0% {
  transform: translate(-50%, -50%) translateY(20px);
  }
  50% {
  transform: translate(-50%, -50%) translateY(70px); /* 아래로 약간 이동 */
  }
  100% {
  transform: translate(-50%, -50%) translateY(20px); /* 원래 위치로 돌아옴 */
  }
}




.service{padding: 150px 0; max-width:1200px; margin: 0 auto; overflow-x: hidden;}
.service .title{text-align: center; color: #fff; margin-bottom: 130px;}
.service .title h2{font-size: 70px; font-weight: 600;}
.service ul li{gap: 55px; align-items: center; margin-bottom: 150px;}
.service ul li:last-child{margin-bottom: 0;}
.service ul li.right{flex-direction: row-reverse;}
.service ul li.right .text{text-align: right;}
.service ul li .text .b_tag h3{font-size: 60px; font-weight: 600; color: #fff; margin-bottom: 40px; line-height: 1.2;}
.service ul li .text .p_tag{font-size: 30px; font-weight: 500; color: rgba(255, 255, 255, 0.5); line-height: 1.3;}
.service>span{font-size: 60px; font-weight: 600; color: #fff; margin-bottom: 40px; line-height: 1.2;margin-top: 150px;display: block;width: 100%;text-align: center;}


.process{padding: 150px 0; max-width: 1640px; margin:0 auto; overflow-x: hidden;}
.process .title{text-align: center; color: #fff; margin-bottom: 130px;}
.process .title h2{font-size: 70px; font-weight: 600;}
.process ul {justify-content: center; align-items: center;}
.process ul li{position: relative; flex-direction: column; justify-content: center; align-items: center; border: 1px solid #B5B5B5; border-radius: 50%;width:25%; aspect-ratio: 1 / 1; margin-left: -40px;}
.process ul li:nth-child(1){margin-left: 0;}
.process ul li .num{margin-bottom: 20px;}
.process ul li .num p{font-size: 30px; color: #fff; font-weight: 600; background: #3874FF; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 50px;}
.process ul li .icon{text-align: center;}
.process ul li .icon img{max-width: 100%;}
.process ul li:nth-child(1) .icon img{animation: process 2s linear infinite 0.2s;}
.process ul li:nth-child(2) .icon img{animation: process 2s linear infinite 0.4s;}
.process ul li:nth-child(3) .icon img{animation: process 2s linear infinite 0.6s;}
.process ul li:nth-child(4) .icon img{animation: process 2s linear infinite 0.8s;}
.process ul li::after{content: ''; position: absolute;  right: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 32px; background: url('/img/process_img05.png') no-repeat; background-size: 100%;}
.process ul li:last-child::after{width: 0;}
.process ul li .text{text-align: center;}
.process ul li .text .b_tag h3{font-size: 36px; color: #fff; font-weight: 500;}

@keyframes process{
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0px);
    }
}



@media all and (max-width:1800px){
    .sub_bnr .title{padding-left: 120px;}
    .sub_bnr .title h1{font-size: 90px; padding-top: 180px;}
    .sub_bnr .title h1 span{font-size: 30px;}
    .sub_bnr .shapeBox .cube{width: 550px; height: 550px; left: 75%;}
    .sub_bnr .shapeBox .circle_left{width: 600px; height: 600px;}
    .sub_bnr .shapeBox .circle_right{width: 600px; height: 600px;}
    .sub_bnr .shapeBox .spring_top{width: 750px; height: 750px;}
    .sub_bnr .shapeBox .spring_bot{width: 750px; height: 750px;}

    /* website */
    #website .sub_bnr .shapeBox .cube{width: 600px; height: 600px;}    
    #website .sub_bnr .shapeBox .circle_right{width: 350px; height: 480px;}
    #website .sub_bnr .shapeBox .cube_top{width: 180px; height: 135px;}

    /* design */
    #design .sub_bnr .shapeBox .cube{width: 850px; height: 710px;}
    #design .sub_bnr .shapeBox .circle_left{width: 635px; height: 570px;}
    #design .sub_bnr .shapeBox .circle_right{width: 300px; height: 300px;}

    /* marketing */
    #marketing .sub_bnr .shapeBox .cube{width: 550px; height: 750px;}
    #marketing .sub_bnr .shapeBox .cube_top{width: 850px; height: 250px;}
    #marketing .sub_bnr .shapeBox .circle_right{width: 150px; height: 500px;}

    /* seo */
    #seo .sub_bnr .shapeBox .cube{width: 700px; height: 850px;}
    #seo .sub_bnr .shapeBox .cube_top{width: 380px; height: 290px;}


    .process{width: 90%;}
    .process ul li{width:calc(100% - 40px);}
    .process ul li .text .b_tag h3{font-size: 32px;}
    .process ul li .icon{width: 180px;}
    .process ul li:nth-child(3) .icon{width: 160px;}
}

@media all and (max-width:1600px){
    .sub_bnr .title{padding-left: 100px;}
    .sub_bnr .title h1{font-size: 80px;}
    .sub_bnr .title h1 span{font-size: 25px;}
    .sub_bnr .title p{font-size: 24px;}
    .sub_bnr .shapeBox .cube{width: 500px; height: 500px; left: 80%;}
    .sub_bnr .shapeBox .circle_left{width: 500px; height: 500px; top: -20%;}
    .sub_bnr .shapeBox .circle_right{width: 500px; height: 500px;}
    .sub_bnr .shapeBox .spring_top{width: 700px; height: 700px;}
    .sub_bnr .shapeBox .spring_bot{width: 700px; height: 700px;}

    /* website */
    #website .sub_bnr .title h1{background-size: 50%;}
    #website .sub_bnr .shapeBox .cube{width: 500px; height: 500px;}    
    #website .sub_bnr .shapeBox .circle_right{width: 300px; height: 430px;}
    #website .sub_bnr .shapeBox .cube_top{width: 160px; height: 115px;}

    /* design */
    #design .sub_bnr .title h1{background-size: 60%; padding-top: 60px;}
    #design .sub_bnr .shapeBox .cube{width: 750px; height: 620px;}
    #design .sub_bnr .shapeBox .circle_left{width: 535px; height: 470px;  top: -5%;}
    #design .sub_bnr .shapeBox .circle_right{width: 250px; height: 250px;}


    /* marketing */
    #marketing .sub_bnr .shapeBox .cube{width: 450px; height: 700px; left: 80%;}
    #marketing .sub_bnr .shapeBox .cube_top{width: 750px; height: 200px;}
    #marketing .sub_bnr .shapeBox .circle_right{width: 120px; height: 400px; left: 95%;}
    #marketing .sub_bnr .shapeBox .cube_bot{width: 180px; height: 200px;}

    /* seo */
    #seo .sub_bnr .shapeBox .cube{width: 600px; height: 700px;}
    #seo .sub_bnr .shapeBox .cube_top{width: 350px; height: 260px;}


    .service .title h2{font-size: 60px;}
    .service ul li .text .b_tag h3{font-size: 50px;}
    .service>span{font-size: 50px}


    .process{width: 90%;}
    .process .title h2{font-size: 60px;}
    .process ul li .num p{font-size: 24px;}
    .process ul li .text .b_tag h3{font-size: 30px;}
}

@media all and (max-width:1400px){
    .sub_bnr .title h1{font-size: 70px; padding-top: 140px;}
    .sub_bnr .title p{font-size: 22px;}
    .sub_bnr .shapeBox .cube{width: 450px; height: 450px;}
    .sub_bnr .shapeBox .circle_left{width: 450px; height: 450px;}
    .sub_bnr .shapeBox .circle_right{width: 450px; height: 450px; left: 97%;}
    .sub_bnr .shapeBox .spring_top{width: 600px; height: 600px;}
    .sub_bnr .shapeBox .spring_bot{width: 600px; height: 600px;}


    /* website */
    #website .sub_bnr .shapeBox .cube{width: 400px; height: 400px;}
    #website .sub_bnr .shapeBox .circle_right{width: 250px; height: 380px;}
    #website .sub_bnr .shapeBox .cube_top{width: 140px; height: 95px;}
    #website .sub_bnr .shapeBox .cube_bot{width: 60px; height: 60px;}
    
    /* design */
    #design .sub_bnr .title h1{padding-top: 40px;}
    #design .sub_bnr .shapeBox .cube{width: 650px; height: 540px; left: 80%;}
    #design .sub_bnr .shapeBox .circle_left{width: 435px; height: 380px;}
    #design .sub_bnr .shapeBox .circle_right{width: 200px; height: 200px; top: 70%;}
    #design .sub_bnr .shapeBox .cube_bot{width: 100px; height: 100px;}

    /* marketing */
    #marketing .sub_bnr .title h1{background-size: 50%; padding-top: 60px;}
    #marketing .sub_bnr .shapeBox .cube{width: 400px; height: 700px;}
    #marketing .sub_bnr .shapeBox .cube_top{width: 600px; height: 180px;}
    #marketing .sub_bnr .shapeBox .circle_right{width: 100px; height: 350px;}
    #marketing .sub_bnr .shapeBox .cube_bot{width: 150px; height: 185px;}

    /* seo */
    #seo .sub_bnr .title h1{padding-top: 60px;}
    #seo .sub_bnr .shapeBox .cube{width: 500px; height: 600px;}
    #seo .sub_bnr .shapeBox .cube_top{width: 300px; height: 210px;}

    .service{width: 90%;}
    .service .title h2{font-size: 55px;}
    .service ul li .text .b_tag h3{font-size: 44px;}
    .service>span{font-size:44px}
    .service ul li .text .p_tag{font-size:26px;}
    
    .process .title h2{font-size: 55px;}
    .process ul li .num p{font-size: 22px;}
    .process ul li .text .b_tag h3{font-size: 26px;}
    .process ul li .icon{width: 150px;}
    .process ul li:nth-child(3) .icon{width: 120px;}
}

@media all and (max-width:1200px){
    .sub_bnr .title {padding-left: 60px;}
    .sub_bnr .title h1{font-size: 60px; padding-top: 100px;}
    .sub_bnr .title h1 span{font-size: 22px;}
    .sub_bnr .title p{font-size: 20px;}

    .sub_bnr .shapeBox .cube{width: 400px; height: 400px;}
    .sub_bnr .shapeBox .circle_left{width: 400px; height: 400px; top: -15%;}
    .sub_bnr .shapeBox .circle_right{width: 400px; height: 400px; top: 80%;}
    .sub_bnr .shapeBox .spring_top{width: 550px; height: 550px;}
    .sub_bnr .shapeBox .spring_bot{width: 550px; height: 550px;}

    /* website */
    #website .sub_bnr .title h1{padding-top: 60px;}
    #website .sub_bnr .shapeBox .cube{width: 300px; height: 300px;}
    #website .sub_bnr .shapeBox .circle_right{width: 200px; height: 330px;}
    #website .sub_bnr .shapeBox .cube_top{width: 120px; height: 75px;}
    #website .sub_bnr .shapeBox .cube_bot{width: 50px; height: 50px;}

    /* design */
    #design .sub_bnr .shapeBox .cube{width: 550px; height: 460px; }
    #design .sub_bnr .shapeBox .circle_left{width: 335px; height: 300px; top: 0;}
    #design .sub_bnr .shapeBox .circle_right{width: 150px; height: 150px;}
    #design .sub_bnr .shapeBox .cube_bot{width: 80px; height: 80px;}
    
    /* marketing */
    #marketing .sub_bnr .title h1{padding-top: 40px;}
    #marketing .sub_bnr .shapeBox .cube{width: 350px; height: 650px;}
    #marketing .sub_bnr .shapeBox .cube_top{width: 500px; height: 150px;}

    /* seo */
    #seo .sub_bnr .shapeBox .cube{width: 400px; height: 500px;}
    #seo .sub_bnr .shapeBox .cube_top{width: 235px; height: 180px;}
    #seo .sub_bnr .shapeBox .cube_bot{width: 150px; height: 210px;}


    .service .title h2{font-size: 50px;}
    .service ul li .text .b_tag h3{font-size: 40px;}
    .service>span{font-size: 40px}

    .service ul li .text .p_tag{font-size:22px;}
    
    .process .title h2{font-size: 50px;}
    .process ul li .num p{font-size: 20px; width: 40px; height: 40px; line-height: 40px;}
    .process ul li .text .b_tag h3{font-size: 22px;}
    .contact_btn{font-size: 20px;}
}

@media all and (max-width:1024px){
    .sub_bnr .title h1{font-size: 60px; padding-top: 80px;}
    .sub_bnr .title p{font-size: 18px;}
    .sub_bnr .shapeBox .cube{width: 350px; height: 350px;}
    .sub_bnr .shapeBox .circle_left{width: 350px; height: 350px; top: -15%;}
    .sub_bnr .shapeBox .circle_right{width: 350px; height: 350px;}
    .sub_bnr .shapeBox .spring_top{width: 500px; height: 500px; top: -10%;}
    .sub_bnr .shapeBox .spring_bot{width: 500px; height: 500px;}

    /* website */
    #website .sub_bnr .title h1{padding-top: 40px;}
    #website .sub_bnr .shapeBox .cube{width: 250px; height: 250px; top: 80%; left: 80%;}
    #website .sub_bnr .shapeBox .circle_right{width: 150px; height: 280px; top: 25%; left: 70%;}
    #website .sub_bnr .shapeBox .cube_top{width: 100px; height: 55px; top: 20%;}


    /* design */
    #design .sub_bnr .shapeBox .cube{width: 450px; height: 375px; top: 35%;}
    #design .sub_bnr .shapeBox .circle_left{width: 280px; height: 250px;}
    #design .sub_bnr .shapeBox .circle_right{width: 100px; height: 100px; left: 75%;}
    #design .sub_bnr .shapeBox .cube_top{width: 30px; height: 30px; left: 10%;}
    #design .sub_bnr .shapeBox .cube_bot{width: 60px; height: 60px; left: 15%;}


    /* marketing */
    #marketing .sub_bnr .shapeBox .cube{width: 300px; height: 600px; top: 80%; left: 75%;}
    #marketing .sub_bnr .shapeBox .circle_right{width: 80px; height: 200px; top: 45%; left: 92%;}
    #marketing .sub_bnr .shapeBox .cube_bot{width: 100px; height: 130px;}


    /* seo */
    #seo .sub_bnr .title h1{padding-top: 40px;}
    #seo .sub_bnr .shapeBox .cube{width: 350px; height: 450px;}
    #seo .sub_bnr .shapeBox .cube_top{width: 195px; height: 150px;}
    #seo .sub_bnr .shapeBox .cube_bot{width: 120px; height: 165px;}


    .service{padding: 100px 0;}
    .service .title{margin-bottom:70px;}
    .service .title h2{font-size: 44px;}
    .service ul li .text .p_tag{font-size: 19px;}
    

    
    .process{padding: 100px 0;}
    .process .title{margin-bottom:70px;}
    .process .title h2{font-size: 44px;}
    .process ul li{margin-left: -30px;}
    .process ul li::after{width: 12px; height: 24px; right: 5px;}
    .process ul li .num p{font-size: 18px; width: 35px; height: 35px; line-height: 35px;}
    .process ul li .text .b_tag h3{font-size: 18px;}
    .process ul li .icon{width: 120px;}
    .process ul li:nth-child(3) .icon{width: 100px;}
    .contact_btn{margin: 80px auto;}
    #business .contact_btn{margin:100px auto 0;}
}


@media all and (max-width:900px){
    .sub_bnr .title h1{font-size: 50px; padding-top: 60px;}
    .sub_bnr .title h1 span{font-size: 20px;}
    .sub_bnr .shapeBox .cube{width: 300px; height: 300px; top: 35%;}
    .sub_bnr .shapeBox .cube_bot{width: 100px; height: 120px;}
    .sub_bnr .shapeBox .circle_left{width: 300px; height: 300px; top: -13%;}
    .sub_bnr .shapeBox .circle_right{width: 300px; height: 300px; top: 85%;}
    .sub_bnr .shapeBox .spring_top{width: 450px; height: 450px; }
    .sub_bnr .shapeBox .spring_bot{width: 450px; height: 450px;}
    

    .service{padding: 120px 0 100px 0;}
    .service ul li{margin-bottom: 100px; flex-direction: column; gap: 40px;}
    .service ul li.right{flex-direction: column;}
    .service ul li .text,
    .service ul li.right .text{text-align: center;}
    .service ul li .text .b_tag h3{font-size: 32px; margin-bottom: 20px;}
    .service>span{font-size: 32px;}

    .service ul li .text .p_tag{font-size:20px;}   
    .service ul li .text .p_tag span.mb{display: block;}
    .service ul li>img{width: 150px;}

    .process{padding: 20px 0 100px 0;}
    .process ul{flex-direction: column; gap: 40px;}
    .process ul li{width: auto; padding: 40px; margin-left: 0;}
    .process ul li::after{top: inherit; right:inherit; bottom: -32px; left: 50%; transform: translateX(-50%) rotate(90deg);}
}




@media all and (max-width:768px){
    .sub_bnr .title{padding-left: 0px; width: 90%; margin: 0 auto;}
    .sub_bnr .title h1{font-size: 50px; padding-top: 60px; line-height: 1.2;}
    .sub_bnr .title h1 span{margin-top: 20px;}
    .sub_bnr .title p{margin-top: 40px; font-size: 18px;}
    .sub_bnr .title p span.mb{display: block; padding-top: 10px;}     
    .sub_bnr .shapeBox .cube{width: 150px; height: 150px; top: 25%; left: 85%;}
    .sub_bnr .shapeBox .circle_left{width: 200px; height: 200px;}
    .sub_bnr .shapeBox .circle_right{width: 250px; height: 250px;}
    .sub_bnr .shapeBox .spring_top{width: 350px; height: 350px; top: -15%;}
    .sub_bnr .shapeBox .spring_bot{width: 300px; height: 300px;}


    #solution .sub_bnr .title h1{background-size: 50%;}
    /* website */
    #website .sub_bnr .title h1{background-size: contain;}
    #website .sub_bnr .shapeBox .cube{width: 200px; height: 200px;}
    #website .sub_bnr .shapeBox .circle_right{width: 100px; height: 230px; top: 20%; left: 70%;}
    #website .sub_bnr .shapeBox .cube_top{width: 80px; height: 35px; top: 20%;}
    #website .sub_bnr .shapeBox .cube_bot{width: 40px; height: 40px;}


    /* design */
    #design .sub_bnr .title h1{background-size: contain;}
    #design .sub_bnr .shapeBox .cube{width: 250px; height: 210px; top: 25%;}
    #design .sub_bnr .shapeBox .circle_left{width: 200px; height: 175px;}
    #design .sub_bnr .shapeBox .circle_right{width: 80px; height: 80px; left: 80%;}

    /* marketing */
    #marketing .sub_bnr .title h1{background-size: contain;}
    #marketing .sub_bnr .shapeBox .cube{width: 250px; height: 400px;}
    #marketing .sub_bnr .shapeBox .circle_right{width: 100px; height: 160px; top: 15%; left: 80%; background-image: url('/img/marketing_img03_m.png');}
    #marketing .sub_bnr .shapeBox .cube_bot{width: 80px; height: 100px;}
    #marketing .sub_bnr .shapeBox .cube_top{width: 400px;}

    /* seo */
    #seo .sub_bnr .title h1{padding-top: 60px; line-height: 1;}
    #seo .sub_bnr .shapeBox .cube{width: 250px; height: 350px; top: 75%;}
    #seo .sub_bnr .shapeBox .cube_bot{width: 100px; height: 135px; left: 15%;}


    .service .title h2{font-size: 38px;}
    .service ul li .text .b_tag h3{font-size: 28px;}
    .service>span{font-size: 20px;}
    .service ul li .text .p_tag{font-size:18px;}
    .service ul li .text .p_tag br{display: none;}
    .service ul li>img{width: 100px;}
    
    .process .title h2{font-size: 38px;}
    .process .title h2 span.mb{display: block;}
    .process ul li{width: 300px; height: 100%; padding: 30px;}
}

@media all and (max-width:600px){
    .sub_bnr .title p br{display: none;}   
}

@media all and (max-width:500px){
    .sub_bnr .title h1{font-size: 44px; padding-top: 100px;}        
    .sub_bnr .shapeBox .cube{width: 80px; height: 80px; top: 20%; left: 75%;}
    .sub_bnr .shapeBox .circle_right{width: 200px; height: 200px;}
    .sub_bnr .shapeBox .spring_top{width: 300px; height: 300px; top: -10%;}
    .sub_bnr .shapeBox .spring_bot{width: 200px; height: 200px; top: 90%;}

    /* website */
    #website .sub_bnr .title h1{padding-top: 20px;}
    #website .sub_bnr .shapeBox .cube{width: 150px; height: 150px;}
    #website .sub_bnr .shapeBox .circle_right{width: 80px; height: 210px; top: 20%; left: 70%;}
    #website .sub_bnr .shapeBox .cube_top{top: 15%;}
    #website .sub_bnr .shapeBox .cube_bot{width: 40px; height: 40px; }


    /* design */
    #design .sub_bnr .title h1{padding-top: 15px;}
    #design .sub_bnr .shapeBox .cube{width: 200px; height: 165px; top: 25%;}
    #design .sub_bnr .shapeBox .cube_bot{width: 50px; height: 50px;  top: 80%;}
    #design .sub_bnr .shapeBox .circle_left{width: 100px; height: 85px;}
    #design .sub_bnr .shapeBox .circle_right{width: 60px; height: 60px; left: 75%;}

    /* marketing */
    #marketing .sub_bnr .title h1{padding-top: 20px;}
    #marketing .sub_bnr .shapeBox .cube{width: 150px; height: 300px; top: 90%;}
    #marketing .sub_bnr .shapeBox .circle_right{width: 50px; height: 80px;}
    #marketing .sub_bnr .shapeBox .cube_bot{width: 50px; height: 65px; top: 75%;}
    #marketing .sub_bnr .shapeBox .cube_top{width: 200px; top: 10%;}

    /* seo */
    #seo .sub_bnr .shapeBox .cube{width: 180px; height: 210px;}
    #seo .sub_bnr .shapeBox .cube_bot{width: 70px; height: 100px; left: 15%;}


    .service .title h2{font-size: 30px;}
    .service ul li .text .b_tag h3{font-size: 24px;}    
    .process .title h2{font-size: 30px;}
    .process ul li{width: 250px;}
    .process ul li .icon{width: 100px;}
    .process ul li:nth-child(3) .icon{width: 80px;}

    .contact_btn{width: calc(100% - 40px);max-width: unset;}
}

@media all and (max-width:380px){
    .sub_bnr .title p{font-size: 16px;}

    .service ul li .text .p_tag{font-size:16px;}
}

/* business 하위메뉴 끝 */




/* portlio 시작 */
#portfolio{overflow-x: hidden;}
#portfolio .portfolio_admin{width: 200px; display: block; position: fixed; bottom: 220px; right: 20px; z-index: 999998; cursor: pointer; font-size: 15px;}
#portfolio .visual{}
#portfolio .visual ul{position: relative;top: 0;left: 0;overflow: hidden;height: 150vh;}
#portfolio .visual ul li{position: absolute; width: 16.666666%;overflow: hidden; display: flex;flex-flow: column;padding-right: 10px;}
#portfolio .visual ul li:first-child{padding-left: 10px;}
#portfolio .visual ul li:nth-child(1){left: 0;}
#portfolio .visual ul li:nth-child(2){left: 16.666666%;}
#portfolio .visual ul li:nth-child(3){left: 33.333332%;}
#portfolio .visual ul li:nth-child(4){left: 49.999998%;}
#portfolio .visual ul li:nth-child(5){left: 66.666664%;}
#portfolio .visual ul li:nth-child(6){left: 83.33333%;}
#portfolio .visual ul li:nth-child(2n-1){top: -30%;}
#portfolio .visual ul li:nth-child(2n){top: 0%;}
#portfolio .visual ul li img{width: 100%;margin-bottom: 10px;}
#portfolio .text_visual{}
#portfolio .text_visual.pc{display: block;}
#portfolio .text_visual.mo{display: none;}
#portfolio .left_text{position: relative;top: 0;left:-60%;font-size: 100px;color: #fff;font-weight: 400;width: fit-content;}
#portfolio .center_1{opacity: 0; font-size: 60px;color: #fff;text-align: center;line-height: 30vh; font-weight: 600;}
#portfolio .center_2{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); height: 150px;width: 15px;background: #fff;opacity: 0;}
#portfolio .right_text{position: relative;bottom: 0;left: 120%;font-size: 100px;color: #fff;font-weight: 400;width: fit-content;}
#portfolio .list{width: calc(100% - 40px);max-width: 1600px;margin: 0 auto;}  
#portfolio .list .content{}
#portfolio .list .content2{display: none;}
#portfolio .list .content ul{}
#portfolio .list .content ul li{padding: 50px;}
#portfolio .list .content ul li .wrap{}
#portfolio .list .content ul li .wrap img{}
#portfolio .list .content ul li .wrap>b{color: #fff; font-size: 30px; font-weight: 500; line-height: 30px; margin-bottom: 20px; display: block;white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#portfolio .list .content ul li .wrap>p{color: #fff;font-weight: 300; line-height: 22px;margin-top: 25px;justify-content: space-between;align-items: center;}
#portfolio .list .content ul li .wrap>p span:nth-child(1){font-size: 22px;display: block;width: calc(100% - 190px);	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#portfolio .list .content ul li .wrap>p span:nth-child(2){font-size: 20px;}
#portfolio .list .btn_wrap{width: 100%;}
#portfolio .list .btn_wrap ul{width: calc(100% - 40px);max-width: 585px;justify-content: space-between;margin: 0 auto 50px;}
#portfolio .list .btn_wrap ul li{width: calc(50% - 10px); font-size: 20px;background: #0b0b126b;}
#portfolio .list .btn_wrap ul li.atv{background:#fff !important;color: #000 !important;font-weight: 600;}
#portfolio .list>p{display: block;width: calc(100% - 40px);max-width: 585px;font-size: 20px;background: #0b0b126b;margin: 0 auto;}
#portfolio #ajaxBox{display: none;position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 999999;}
#portfolio #ajaxBox::before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #00000073; backdrop-filter: blur(2px); display: block;}
#portfolio #ajaxBox .wrap{position: absolute;right:calc(-100% + 33.33333%);width: calc(100% - 33.33333%);min-width: 300px;top: 0;height: 100%;background: #fff;justify-content: space-between;}
#portfolio #ajaxBox .wrap.atv{animation:right 0.3s both;}
#portfolio #ajaxBox .wrap .close_btn{position: absolute;top: 50px;right: 50px;width: 35px;height: 35px;cursor: pointer;}
#portfolio #ajaxBox .wrap .close_btn span{width: 3px;height: 35px;background: #fff;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
#portfolio #ajaxBox .wrap .close_btn span:nth-child(1){transform: translate(-50%, -50%) rotate(45deg);}
#portfolio #ajaxBox .wrap .close_btn span:nth-child(2){transform: translate(-50%, -50%) rotate(-45deg);}
#portfolio #ajaxBox .wrap .left{width: 50%;max-height: 100%;overflow-y: auto;}
#portfolio #ajaxBox .wrap .left::-webkit-scrollbar {width: 10px;}
#portfolio #ajaxBox .wrap .left::-webkit-scrollbar-thumb {background-color: #2f3542;}
#portfolio #ajaxBox .wrap .left::-webkit-scrollbar-track {background-color: grey;}
#portfolio #ajaxBox .wrap .left img{width: 100%;cursor: pointer;}
#portfolio #ajaxBox .wrap .right{width: 50%;padding: 70px;max-height: 100%;overflow-y: auto;background: #111111;}
#portfolio #ajaxBox .wrap .right::-webkit-scrollbar {width: 10px;}
#portfolio #ajaxBox .wrap .right::-webkit-scrollbar-thumb {background-color: #2f3542;}
#portfolio #ajaxBox .wrap .right::-webkit-scrollbar-track {background-color: grey;}
#portfolio #ajaxBox .wrap .right>p{color: #fff !important;font-size: 18px;line-height: 18px; margin-bottom: 30px;}
#portfolio #ajaxBox .wrap .right>b{color: #fff !important;font-size: 40px;line-height: 40px; margin-bottom: 25px;display: block;}
#portfolio #ajaxBox .wrap .right>span{color: #fff !important;font-size: 20px;}
#portfolio #ajaxBox .wrap .right>div{color: #fff !important;margin-top: 50px;padding-top: 50px;border-top: 1px solid #D9D9D9;}
#portfolio #ajaxBox .wrap .right>div p,
#portfolio #ajaxBox .wrap .right>div span,
#portfolio #ajaxBox .wrap .right>div h1,
#portfolio #ajaxBox .wrap .right>div h2,
#portfolio #ajaxBox .wrap .right>div h3,
#portfolio #ajaxBox .wrap .right>div h4,
#portfolio #ajaxBox .wrap .right>div h5,
#portfolio #ajaxBox .wrap .right>div h6,
#portfolio #ajaxBox .wrap .right>div b,
#portfolio #ajaxBox .wrap .right>div a{word-break: keep-all !important;}
#portfolio #ajaxBox .wrap .right>a{color: #fff !important; font-size: 16px; margin-top: 50px; display: block; text-align: right; height: 50px; line-height: 50px;}
@-webkit-keyframes right {
    0% {
        right:calc(-100% + 33.33333%)
    }
    100% {
        right: 0;
    }
}
#portfolio .btnBox{width: calc(100% - 40px);max-width: 585px;justify-content: space-between;margin: 50px auto 0px;display: flex;}
#portfolio .btnBox p{width: calc(50% - 10px); font-size: 20px;background: #0b0b126b;}
#portfolio .btnBox p.atv{background:#fff !important;color: #000 !important;font-weight: 600;}

@media screen and (max-width:1200px){
    #portfolio{}
    #portfolio .text_visual{padding: 200px 0 50px;}
    #portfolio .text_visual.pc{display: none;}
    #portfolio .text_visual.mo{display: block;}
    #portfolio .visual ul{height: 80vh;}
    #portfolio .visual ul li{width: 20%;}
    #portfolio .visual ul li:nth-child(2){left: 20%;}
    #portfolio .visual ul li:nth-child(3){left: 40%;}
    #portfolio .visual ul li:nth-child(4){left: 60%;}
    #portfolio .visual ul li:nth-child(5){left: 80%;}
    #portfolio .visual ul li:nth-child(6){display: none !important;}
    #portfolio .left_text{left: 0;position: unset; width: 100%;text-align: center;font-size: 60px;line-height: 60px;}
    #portfolio .center_1{opacity: 1; font-size: 30px;line-height: unset;padding: 20px 0 15px; font-weight: 300;}
    #portfolio .right_text{left: 0;position: unset;width: 100%;text-align: center;font-size: 60px;line-height: 60px;}
    #portfolio .list .content ul li .wrap>b{font-size: 25px; line-height: 25px;}
    #portfolio .list .content ul li .wrap>p span:nth-child(1){font-size: 20px;width: calc(100% - 180px);}
    #portfolio .list .content ul li .wrap>p span:nth-child(2){font-size: 18px;}
    #portfolio #ajaxBox .wrap{width: 100%;right: -100%;}
    #portfolio #ajaxBox .wrap .right{padding: 50px;}
    #portfolio #ajaxBox .wrap .right>b{font-size: 30px;line-height: 30px; margin-bottom: 10px;}
    #portfolio #ajaxBox .wrap .right>span{font-size: 20px;}
    #portfolio #ajaxBox .wrap .right>a{margin-top: 30px;}
}
@media screen and (max-width:1000px){
    #portfolio{}
    #portfolio .list .content ul li{padding: 30px;}
    #portfolio .list .content ul li .wrap>b{font-size: 20px; line-height: 20px;margin-bottom: 15px;}
    #portfolio .list .content ul li .wrap>p{margin-top: 15px;}
    #portfolio .list .content ul li .wrap>p span:nth-child(1){font-size: 17px;}
    #portfolio .list .content ul li .wrap>p span:nth-child(2){font-size: 15px;}
}
@media screen and (max-width:900px){
    #portfolio{}
    #portfolio .portfolio_admin{width: 150px; bottom: 120px;}
    #portfolio .visual ul{height: 60vh;}
    #portfolio .visual ul li{width: 25%;}
    #portfolio .visual ul li:nth-child(2){left: 25%;}
    #portfolio .visual ul li:nth-child(3){left: 50%;}
    #portfolio .visual ul li:nth-child(4){left: 75%;}
    #portfolio .visual ul li:nth-child(5){display: none !important;}
    #portfolio .left_text{font-size: 40px;line-height: 40px;padding: 0 20px;}
    #portfolio .center_1{font-size: 20px;padding: 10px 20px 10px;}
    #portfolio .right_text{font-size: 40px;line-height: 40px;padding: 0 20px;}
    #portfolio .list .content ul li{width: 100% !important;flex:unset !important;max-width: unset !important;}
    #portfolio .list .content ul li .wrap>b{font-size: 20px; line-height: 20px;margin-bottom: 15px;}
    #portfolio .list .content ul li .wrap>p{margin-top: 15px;}
    #portfolio .list .content ul li .wrap>p span:nth-child(1){font-size: 17px;width: calc(100% - 150px);}
    #portfolio .list .content ul li .wrap>p span:nth-child(2){font-size: 15px;}
    #portfolio .list .btn_wrap ul{max-width: 500px;}
    #portfolio .btnBox{max-width: 500px;}
    #portfolio #ajaxBox .wrap .right{padding: 20px;}
    #portfolio #ajaxBox .wrap .close_btn{top: 10px;right: 10px;}
    #portfolio #ajaxBox .wrap .close_btn span{height: 20PX;}
    #portfolio #ajaxBox .wrap .right>p{font-size: 15px;margin-bottom: 20px;}
    #portfolio #ajaxBox .wrap .right>b{font-size: 20px;line-height: 20px;}
    #portfolio #ajaxBox .wrap .right>span{font-size: 15px;}
    #portfolio #ajaxBox .wrap .right>div{margin-top: 30px;padding-top: 30px;}
    #portfolio #ajaxBox .wrap .right>a{font-size: 15px;}
    
    
}
@media screen and (max-width:700px){
    #portfolio .text_visual{padding: 100px 0 50px;}
    #portfolio .left_text{font-size: 30px;line-height: 30px;}
    #portfolio .center_1{font-size: 17px;}
    #portfolio .right_text{font-size: 30px;line-height: 30px;}
    #portfolio #ajaxBox .wrap{flex-flow: row wrap;}
    #portfolio #ajaxBox .wrap .left{width: 100% !important;height: 40%;}
    #portfolio #ajaxBox .wrap .right{width: 100%;height: 60%;}
    #portfolio .list .btn_wrap ul{max-width: 400px;}
    #portfolio .btnBox{max-width: 400px;}
}
@media screen and (max-width:500px){
    #portfolio .visual ul li{width: 33.333333%;}
    #portfolio .visual ul li:nth-child(2){left: 33.333333%;}
    #portfolio .visual ul li:nth-child(3){left: 66.666666%;}
    #portfolio .visual ul li:nth-child(4){display: none !important;}
    #portfolio .text_visual{padding: 50px 0 50px;}
    #portfolio .left_text{font-size: 20px;line-height: 20px;}
    #portfolio .center_1{font-size: 15px;}
    #portfolio .right_text{font-size: 20px;line-height: 20px;}
    #portfolio .list .content ul li{padding: 20px 10px;}
    #portfolio .list .content ul li .wrap>p span:nth-child(1){opacity: 0;}
    #portfolio{padding-bottom: 0px;}
}
/* portlio 끝 */







/* about 시작 */
#about{}
#about .visual.pc{width: 100%;padding: 30px 0;display: block;}
#about .visual.mo{display: none;}
#about .visual .left_text{font-size: 70px;color: #fff;position: absolute;top: -25px;left: 0;z-index: 1;}
#about .visual .right_text{font-size: 70px;color: #fff;position: absolute;bottom: -22px;right: 0;}
#about .visual .img{width: 100%;height: 700px; position: relative;top: 50%;left: 50%;transform: translate(-50%, -50%);background-image: url(/../../img/about_bg_main.png);background-size: cover;background-repeat: no-repeat;background-position: center bottom;}
#about .bg_change{margin-top: 100px;}
#about .bg_change .content{}
#about .bg_change .content ul{position: relative;width: 100vw;height: 100vh;background-image: url(/../../img/about_bg.png);background-size: cover;background-repeat: no-repeat;background-position: center;}
#about .bg_change .content ul li{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: calc(100% - 220px);height: calc(100% - 220px);max-width: 1000px;opacity: 0;}
#about .bg_change .content ul li:nth-child(1){background-image: url(/../../img/about_bg1.png);background-size: cover;background-repeat: no-repeat;background-position: center;}
#about .bg_change .content ul li:nth-child(2){background-image: url(/../../img/about_bg2.png);background-size: cover;background-repeat: no-repeat;background-position: center;}
#about .bg_change .content ul li:nth-child(3){background-image: url(/../../img/about_bg3.png);background-size: cover;background-repeat: no-repeat;background-position: center;}
#about .bg_change .content ul li:nth-child(4){background-image: url(/../../img/about_bg4.png);background-size: cover;background-repeat: no-repeat;background-position: center;}
#about .bg_change .content ul li b{font-size: 60px;color: #fff;text-align: center;position: absolute;top: 50%;left: calc(50% - 50px);transform: translate(-50%, -50%);width: 100%;word-break: keep-all;font-weight: 500;}
#about .bg_change .content ul li b.pc{display: block;}
#about .bg_change .content ul li b.mo{display: none;}
.select_title{font-size: 70px;color: #fff;font-weight: 400;margin-top: 180px;margin-bottom: 100px;display: block;}
#about .org{width: calc(100% - 40px);max-width: 1600px;margin: 0 auto;}
#about .org .wrap{width: 100%;max-width: 1500px;}
#about .org .main{position: relative;top: 0;left: 0;}
#about .org .main .part{color: #fff;font-weight: 500; border: 1px solid #ffffff73;background: #3c3c41 !important; font-size: 25px; width: 250px; display: block; text-align: center; height: 80px; line-height: 78px;}
#about .org .main li{margin-bottom: 80px;}
#about .org .main li:last-child{margin-bottom: 0px;}
#about .org .main li b{position: relative;top: 0;left: 0;}
#about .org .main li b.point{font-size: 30px;border-radius: 50px;font-weight: 600;border: none; background: #2929AA !important;}
#about .org .main li b::after{content:"";position: absolute;bottom: -80px;width: 1px;height: 80px;background: #ffffff73;left: 50%;transform: translateX(-50%);}
#about .org .main li:nth-child(2) b::after,
#about .org .main li:nth-child(4) b::after{display: none;}
#about .org .main li:nth-child(4){position: relative;top: 0;left: 0;}
#about .org .main li:nth-child(4)::before{content: ""; position: absolute; width: calc(100% - 75px); height: 1px; background: #ffffff73; top: 50%; left: 0; transform: translateY(-50%);}
#about .org .main li.add{position: absolute;top: 80px;left: 364px;}
#about .org .main li.add b{background: unset !important;}
#about .org .main li.add b::before{content: ""; position: absolute; width: calc(100% - 10px); height: 1px; background: #ffffff73; top: 50%; left: -96%; transform: translateY(-50%);}
#about .org .main li.add b::after{background-image: url(/../../img/about_icon1.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 30%; height: auto; top: -50px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; display: block; background-color: unset; bottom: unset;}
#about .org .sub{width: 100%;justify-content: space-between;align-items: center;padding-left: 330px;padding-top: 41px;}
#about .org .sub .part{color: #fff;font-weight: 500; border: 1px solid #ffffff73; font-size: 22px; width: 150px;height: 150px; display: block;position: relative;top: 0;left: 0;border-radius: 80px;}
#about .org .sub .part span{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);display: block;text-align: center;width: 100%;}
#about .org .sub li{}
#about .org .sub li b{position: relative;top: 0;left: 0;margin-bottom: 30px;}
#about .org .sub li b::after{content:"";position: absolute;top: -81px;width: 1px;height: 80px;background: #ffffff73;left: 50%;transform: translateX(-50%);}
#about .org .sub li:nth-child(1) b::before{background-image:url(/../../img/about_icon2.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1;}
#about .org .sub li:nth-child(2) b::before{background-image:url(/../../img/about_icon3.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1;}
#about .org .sub li:nth-child(3) b::before{background-image:url(/../../img/about_icon4.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1;}
#about .org .sub li:nth-child(4) b::before{background-image:url(/../../img/about_icon5.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1;}
#about .org .sub li:nth-child(5) b::before{background-image:url(/../../img/about_icon6.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1;}
#about .org .sub li>p{font-size: 18px;color: #fff;align-items: center;font-weight: 200; word-break: keep-all;}
#about .org .sub li>p>span{width: 5px;height: 5px;border-radius: 5px;background: #fff;margin-right: 12px;}
#about .office{width: calc(100% - 40px);max-width: 1600px;margin: 0 auto;}
#about .office ul{flex-flow: column;height: 600px;}
#about .office ul li{width: 100%;height: 50%;position: relative;top: 0;left: 0;}
#about .office ul li iframe{width: 100%;height: 100%;}
#about .office ul li>div.text_wrap{position: absolute; top: 0; right: 0; width: 40%; height: 100%; background: #000000a6; display: flex;padding: 0 80px;}
#about .office ul li:nth-child(1) div.text_wrap{border-bottom: 1px solid #ffffff8a;padding-bottom: 50px;align-items: flex-end;}
#about .office ul li:nth-child(2) div.text_wrap{padding-top: 50px;align-items:flex-start}
#about .office ul li>div.text_wrap div{}
#about .office ul li>div.text_wrap b{font-size: 25px; color: #fff; font-weight: 600; margin-bottom: 20px; display: block; line-height: 25px;}
#about .office ul li>div.text_wrap p{font-size: 20px;color: #fff;font-weight: 300;line-height: 20px;margin-bottom: 15px; word-break: keep-all;display: flex;}
#about .office ul li>div.text_wrap p:last-child{margin-bottom: 0px;}
#about .office ul li>div.text_wrap span{padding-right: 25px;}
@media screen and (max-width:1600px){
    #about{}
    #about .visual.pc{display: none;}
    #about .visual.mo{display: block;}
    #about .visual{position: relative;top: 0;left: 0;height: 500px;}
    #about .visual .img{height: 100%;}
    #about .visual .left_text{font-size: 60px;top: 130px;left: 50%; transform: translateX(-50%); width: 100%; text-align: center;}
    #about .visual .right_text{font-size: 60px;bottom: 200px;left: 50%; transform: translateX(-50%); width: 100%; text-align: center;}
    #about .bg_change{margin-top: 0;}
    #about .bg_change .content{}
    #about .bg_change .content ul{position: unset;display: flex;justify-content: space-between;align-items: center;flex-flow: row wrap;height: fit-content !important;}
    #about .bg_change .content ul li{opacity: 1;position: unset;width: 100%;transform:unset;max-width: unset;height: 500px;display: flex;justify-content: center;align-items: center;}
    #about .bg_change .content ul li b{font-size: 50px;position: unset;transform: translate(0, 0);}
    #about .bg_change .content ul li b.pc{display: none;}
    #about .bg_change .content ul li b.mo{display: block;}
    .select_title{font-size: 60px;margin-bottom: 50px;}
    #about .org .main li{margin-bottom: 50px;}
    #about .org .main .part{font-size: 18px; width:180px;height: 60px; line-height: 58px;}
    #about .org .main li.add{top: 54px;left: 258px;}
    #about .org .main li.add b::before{left: -95%;}     
    #about .org .main li.add b::after{top: -40px;}
    #about .org .main li b.point{font-size: 20px;}
    #about .org .main li b::after{height: 50px;bottom: -51px;}
    #about .org .sub{padding-top: 20px; padding-left: 230px;}
    #about .org .sub .part{font-size: 16px; width: 100px;height: 100px;}
    #about .org .sub .part span{line-height: 19px;}
    #about .org .sub li{width:20%;}
    #about .org .sub li b{margin-bottom: 15px;}
    #about .org .sub li b::after{height: 50px;top: -50px;}
    #about .org .sub li>p{font-size: 15px;}
    #about .office ul li>div.text_wrap b{font-size: 20px;}
    #about .office ul li>div.text_wrap p{font-size: 17px;margin-bottom: 5px;}
}
@media screen and (max-width:1000px){
    #about .visual{height: 300px;}
    #about .visual .img{width: 100%; height: 500px; position: absolute; top: 19%; }
    #about .visual .left_text{font-size: 50px;top: 30px;}
    #about .visual .right_text{font-size: 50px;bottom: 130px;}
    #about .bg_change .content ul li{height: 300px;}
    #about .bg_change .content ul li b {font-size: 35px;line-height: 45px;}
    .select_title{margin-top: 100px;font-size: 50px;}
    #about .org .main li:nth-child(4)::before{width: 281px;}
    #about .org .sub{flex-flow: row wrap;padding-top: 0;}
    #about .org .sub li{width: 100%;position: relative;top: 0;left: 0;}
    #about .org .sub .part{margin-bottom: 30px;}
    #about .org .sub li b::after{height: 28px;top: -30px;}
    #about .org .main li.add b::after{top: -20px;width: 20%;}
    #about .org .sub li:nth-child(1) b::before{width: 40%;top: -10px;transform: unset;left: unset;right: 0;}
    #about .org .sub li:nth-child(2) b::before{width: 40%;top: -10px;transform: unset;left: unset;right: 0;}
    #about .org .sub li:nth-child(3) b::before{width: 40%;top: -10px;transform: unset;left: unset;right: 0;}
    #about .org .sub li:nth-child(4) b::before{width: 40%;top: -10px;transform: unset;left: unset;right: 0;}
    #about .org .sub li:nth-child(5) b::before{width: 40%;top: -10px;transform: unset;left: unset;right: 0;}
    #about .org .sub li>p{position: absolute;left: 120px;top: 30px;}
    #about .org .sub li>p:last-child{top: 50px;}
    #about .office ul{height: 800px;gap: 20px;}
    #about .office ul li>div.text_wrap{width: 100%;height: fit-content; padding: 20px !important;border: unset !important;align-items:unset !important;top: unset;bottom: 0;}
    #about .office ul li>div.text_wrap b{font-size: 17px;}
    #about .office ul li>div.text_wrap p{font-size: 15px;display: flex;}
    #about .office ul li>div.text_wrap span{width: 55px;}
}
@media screen and (max-width:700px){
    #about .visual .left_text{font-size: 40px; top: 40px;}
    #about .visual .right_text{font-size: 40px; bottom: 150px;}
    #about .bg_change .content ul li{height: 200px;}
    #about .bg_change .content ul li b {font-size: 25px;line-height: 34px;}
    .select_title{margin-top: 70px;font-size: 40px;margin-bottom: 30px;}

}
@media screen and (max-width:500px){
    #about{}
    #about .visual .left_text{font-size: 30px;top: 70px; }
    #about .visual .right_text{font-size: 30px;}
    #about .bg_change .content ul li b{font-size: 20px; line-height: 30px;}
    .select_title{margin-top: 50px; margin-bottom: 20px; font-size: 25px;}
    #about .org .main li b.point{font-size: 18px;}
    #about .org .main .part{font-size: 16px;width: 120px;}
    #about .org .main li.add{left: 169px;}
    #about .org .main li.add b::before{left: -92%;}
    #about .org .main li.add b::after{width: 30%;}
    #about .org .sub{padding-left: 135px;}
    #about .org .main li:nth-child(4)::before { width: 176px; }
    #about .org .sub .part{font-size: 15px;width: 80px;height: 80px;}
    #about .org .sub li>p{left: 93px;top: 20px;}
    #about .org .sub li>p:last-child{top: 40px;}
}
@media screen and (max-width:410px){
    #about .org .sub li>p{font-size: 13px;}
}
/* about 끝 */

.ajax_wr4 p {font-size:20px;}