#main_visual {
    clear: both;
    position: relative;
    text-align: center;
    width: 100%;
    padding: 0;
    margin: 0px auto;
    overflow: hidden
}

#main_visual:after {
    content: "";
    display: block;
    clear: both
}

#main_visual [class~=swiper-slide] {
    width: 100%;
    height: auto;
    padding: 0;
    background-color: #000;
    overflow: hidden
}

#main_visual [class~=swiper-slide] div[class~=backgroundimg] {
    width: 100%;
    height: 100%;
    z-index: 1
}

#main_visual [class~=swiper-slide] [class~=backgroundimg] [class~=mobile_only] {
    display: none
}

#main_visual [class~=swiper-slide] [class~=backgroundimg] img {
    width: 100%;
    height: auto
}

#main_visual [class~=sliderkit-text_01] {
    width: 100%;
    height: 200px;
    max-width: 1300px;
    position: absolute;
    top: 63%;
    margin-top: -100px;
    left: 50%;
    margin-left: -650px;
    text-align: left;
    z-index: 2
}

#main_visual [class~=sliderkit-text_01] h1[class~=lviewa] {
    opacity: 0;
    font-size: 3.9em;
    color: #fff;
    line-height: 1.3em;
    font-weight: 700;
    padding-bottom: 10px;
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

#main_visual [class~=sliderkit-text_01] h1[class~=sviewa] {
    opacity: 0;
    font-size: 1.3em;
    color: #fff;
    line-height: 1.3em;
    padding-bottom: 10px;
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

#main_visual [class~=sliderkit-text_01] div {
    opacity: 0;
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

#main_visual [class~=sliderkit-text_01] div span {
    display: inline-block;
    /*padding: 10px 15px;
    margin: 10px auto;
    background: #000;8*/
    border-radius: 5px
}

#main_visual [class~=sliderkit-text_01] div span h2 {
    font-size: 1em;
    color: #fff;
    letter-spacing: 0.05em
}

#main_visual [class~=swiper-button-prev] {
    left: 60px;
    top: 55%;
    margin-top: -25px;
    display: block;
    background: url("../images/main/visual_prev_on.png") center left no-repeat;
    opacity: 0.7;
    width: 50px;
    height: 50px;
    color: rgba(255,255,255,0);
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

[class~=swiper-container-rtl] [class~=swiper-button-next] {
    left: 60px;
    top: 55%;
    margin-top: -25px;
    display: block;
    background: url("../images/main/visual_prev_on.png") center left no-repeat;
    opacity: 0.7;
    width: 50px;
    height: 50px;
    color: rgba(255,255,255,0);
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

#main_visual [class~=swiper-button-next] {
    right: 60px;
    top: 55%;
    margin-top: -25px;
    display: block;
    background: url("../images/main/visual_next_on.png") center right no-repeat;
    opacity: 0.7;
    width: 50px;
    height: 50px;
    color: rgba(255,255,255,0);
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

[class~=swiper-container-rtl] [class~=swiper-button-prev] {
    right: 60px;
    top: 55%;
    margin-top: -25px;
    display: block;
    background: url("../images/main/visual_next_on.png") center right no-repeat;
    opacity: 0.7;
    width: 50px;
    height: 50px;
    color: rgba(255,255,255,0);
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    -moz-transition: 0.5s all ease;
    -ms-transition: 0.5s all ease;
    -o-transition: 0.5s all ease
}

.main_diagramimg .pc_only {display:block;}
.main_diagramimg .mobile_only {display:none;}
#main_visual [class~=swiper-slide] div[class~=backgroundimg] .pc_only {height:100vh;width:100%;overflow: hidden;min-height: 910px;}
#main_visual [class~=swiper-slide] div[class~=backgroundimg] .pc_only img {height:100%;width: auto;min-width: 100%;}
#main_visual [class~=sliderkit-text_01] {max-width: 1500px;height: auto;position: absolute;margin: 0;transform: translate(-50%,-50%);display: flex;flex-direction: row-reverse;justify-content: space-between;}
#main_visual [class~=sliderkit-text_01] div {opacity: 1;position: relative;}
#main_visual .visual_txt {color: #fff;margin-top: 2rem;}
#main_visual .visual_txt .keyword {display: block;font-size: 1.25em;font-weight:700;margin-bottom: 1.2em;}
#main_visual .visual_txt p {color:#fff;font-size: 2.4em;font-weight: 300;line-height: 1.1;}
#main_visual .visual_txt .big {display: block;font-size: 1.5em;padding: 0;margin: 0;background: none;border-radius: 0;}
#main_visual .visual_txt .sub_txt {font-size: 1.3em;font-weight: 300;letter-spacing: -0.06em;line-height: 1.5;margin-top: 1.5em;}



#main_visual .visual_txt_02 {color: #fff;margin-top: 2rem; font-family:'Gmarket'; text-shadow: 3px 3px 6px #333; left:85%;}
#main_visual .visual_txt_02 .keyword {display: block;font-size: 1.25em;font-weight:700;margin-bottom: 1.2em;}
#main_visual .visual_txt_02 p {color:#fff;font-size: 2.4em;font-weight: 300;line-height: 1.1;}
#main_visual .visual_txt_02 .big {display: block;font-size: 1.5em;padding: 0;margin: 0;background: none;border-radius: 0;}
#main_visual .visual_txt_02 .sub_txt {font-size: 1.3em;font-weight: 400;letter-spacing: -0.06em;line-height: 1.5;margin-top: 1.5em;}
#main_visual .visual_txt_02 .big_type01{color:#ff8500; background:none;}





#main_visual [class~=swiper-button-prev]:hover {
    opacity: 1
}

[class~=swiper-container-rtl] [class~=swiper-button-next]:hover {
    opacity: 1
}

#main_visual [class~=swiper-button-next]:hover {
    opacity: 1
}

[class~=swiper-container-rtl] [class~=swiper-button-prev]:hover {
    opacity: 1
}

#main_visual [class~=swiper-pagination] {
    width: 1500px;
    left: 50%;
    bottom: 15%;
    transform: translate(-50%,50%);
    text-align: left
}

#main_visual [class~=swiper-pagination-bullet] {
    width: 10px;
    height: 10px;
    border-radius: 5px;
    opacity: 0.7;
    transition: 0.4s ease;
    background: #ff8400;
}

#main_visual [class~=swiper-pagination-bullet-active] {
    width: 70px;
    background: #ff8400;
    opacity: 1
}

@media screen and (max-width: 360px) {
}

@media all and (max-width: 1300px) {
    #main_visual [class~=sliderkit-text_01] {
        height:160px;
        margin-top: -80px;
        max-width: 1000px;
        margin-left: -500px
    }
}

@media all and (max-width: 1300px) {
    #main_visual [class~=sliderkit-text_01] h1[class~=lviewa] {
        font-size:2em
    }
}

@media all and (max-width: 1300px) {
    #main_visual [class~=sliderkit-text_01] h1[class~=sviewa] {
        font-size:1.2em
    }
}

@media all and (max-width: 1200px) {
    #container {
        margin-top:0px
    }
}

@media all and (max-width: 1100px) {
    #container {
        margin-top:0px
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=swiper-slide] {
        width:100%;
        height: auto
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=swiper-slide] div[class~=backgroundimg] {
        height:auto
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=sliderkit-text_01] {
        height:150px;
        max-width: 100%;
        margin-top: -70px;
        left: 0;
        margin-left: 0;
        text-align: center
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=sliderkit-text_01] h1[class~=lviewa] {
        font-size:1.5em
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=sliderkit-text_01] h1[class~=sviewa] {
        font-size:0.95em
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=sliderkit-text_01] div span h2 {
        font-size:1em
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=swiper-pagination] {
        width:100%;
        left: 0;
        bottom: 0;
        padding-right: 1rem;
        transform: none;
        text-align: right
    }
}

@media all and (max-width: 1100px) {
    #main_visual [class~=swiper-pagination-bullet-active] {
        width:35px
    }
}

@media screen and (max-width: 768px) {
    #main_visual [class~=swiper-slide] [class~=backgroundimg] [class~=mobile_only] {
        display:block
    }
}

@media screen and (max-width: 768px) {
    #main_visual [class~=swiper-slide] [class~=backgroundimg] [class~=pc_only] {
        display:none
    }
}

@media screen and (max-width: 768px) {
    [class~=swiper-button-next] {
        display:none !important
    }

    [class~=swiper-button-prev] {
        display: none !important
    }
    [class~=swiper-pagination-bullet] {
        display: none !important
    }
}



@media screen and (max-width: 768px) {
    [class~=visual_area] {
        background-position:center top;
        background-size: cover !important
    }
}


/* 반응형 중간기기 1300px 사이즈 이하*/
@media all and (max-width:1300px){
    /*메인*/
    #main_visual [class~=sliderkit-text_01] {max-width:95%;}
    #main_visual [class~=swiper-pagination] {width: 95%;margin: 0 auto;}
    .diagram {width:50%;}
    .maintxt {width:50%;}
    .diagram .main_diagramimg .pc_only img {width:100%;}
}

/* 반응형 중간기기 1200px 사이즈 이하*/
@media all and (max-width:1200px){

}

/* 반응형 중간기기 1100px 사이즈 이하*/
@media (max-width: 1100px){
    /*메인*/
    #main_visual [class~=sliderkit-text_01] {height:auto;margin: 0;top: 0;height: 100%;width: 100%;max-width: 100%;flex-direction: column-reverse;transform: none;}
    #main_visual [class~=sliderkit-text_01] div {opacity: 1;}
    #main_visual [class~=swiper-slide] div[class~=backgroundimg] .pc_only {display:none;}
    #main_visual [class~=swiper-slide] div[class~=backgroundimg] .mobile_only {display:block;}
    .main_diagramimg .pc_only {display:none;}
    .main_diagramimg .mobile_only {display:block;width: 100%;height:100%;}
    .main_diagramimg .mobile_only img {width:100%;height:100%;}
    #main_visual [class~=swiper-pagination] {width:100%;bottom: 1rem;}

    .diagram {width:100%;}
    .maintxt {position: absolute !important;width:100%;top: 4rem;text-align: center;}
    #main_visual .visual_txt {margin-top: 0;}
    #main_visual .visual_txt .keyword {display:none;}
    #main_visual .visual_txt .sub_txt {display:none;}
}

/* 반응형 중간기기 768사이즈 이하 */
@media screen and (max-width: 768px) {
    /*메인*/
}

/* 반응형 중간기기 540사이즈 이하 */
@media screen and (max-width: 540px) {
    /*메인*/
    #main_visual .visual_txt p {font-size: 2em;}
}

/* 반응형 작은기기 480사이즈 이하 */
@media screen and (max-width: 480px) {
    /*메인*/
    #main_visual .visual_txt p {font-size:1.6em;}
}

/* 반응형 작은기기 414사이즈 이하 */
@media screen and (max-width: 415px) {
     html {font-size: 13px;}
}
/* 반응형 작은기기 375사이즈 이하 */
@media screen and (max-width: 376px) {
    html {font-size: 13px;}
    /*메인*/
    #main_visual .visual_txt .big {font-size:2rem;}
}

/* 반응형 작은기기 360사이즈 이하 */
@media screen and (max-width: 360px) {
    html {font-size: 12px;}
}