@charset "utf-8";
.mEnter{display:block;}
.pEnter{display:inline-block;}
.blue{color:#0083ef}
.red{color:#d10000}
.inner{max-width:1500px; width:100%; position:relative; margin: 0 auto;}
#sub .inner{max-width: 1500px;padding:0 3%;position:relative;margin: 0 auto;}
.pdinner{max-width: 1450px;padding:0 3%;position:relative;margin: 0 auto;}
#sub .pdinner{max-width: 1400px;padding:0 3%;position:relative;margin: 0 auto;}
.ofh{overflow:hidden;}
.clear:after {content:''; display:block; clear:both;}

.mb{margin-bottom:30px !important}
.bmb{margin-bottom:40px !important}
.pb{padding-bottom:30px !important}
.bpb{padding-bottom:40px !important}
.mb10{margin-bottom:10px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !important;}
.pd{padding-top:40px; }

.tac{text-align:center;}
.tal{text-align:left;}
.tar{text-align:right;}
.mo_only{display:block;}

@media all and (min-width:768px) {
.mb{margin-bottom:40px !important; }
.bmb{margin-bottom:80px !important;}
.pb{padding-bottom:40px !important}
.bpb{padding-bottom:60px !important}
.mo_only{display:none;}
.move_scroll{max-width:100%;}
.pdinner{padding:0 3%}
.pd{padding-top:60px; }
}

@media all and (min-width:1200px) {
  .mEnter{display:inline-block;}
  .pEnter{display:block;}
  body, html{font-size:17px; line-height:1.5}
.mb{margin-bottom:50px !important}
.bmb{margin-bottom:120px !important}
.pb{padding-bottom:50px !important}
.bpb{padding-bottom:80px !important}
.pdinner{padding:0 20px;}
.pd{padding-top:80px; }
}

@media all and (min-width:1400px) {
.pd{padding-top:100px; }
}

@media all and (min-width:1600px) {
.pd{padding-top:120px; }
}

@media all and (min-width:1800px) {
.pd{padding-top:140px; }
}



/*서브레이아웃*/
/* 서브레이아웃 */
.sub_vis_top{position: relative;}
#sub_vis {
    position: relative;
    /* padding: 40px 0; */
    color: #fff;
    text-align: center;
    /* margin: 60px 0 0; */
    padding-top: 98px;
    padding-bottom: 79px;
    overflow: hidden;
    /* text-align: left; */
}
#sub_vis:after{
    display:block;
    clear:both;
    content:"";
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover !important;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    animation: zoomout 1s ease-in-out infinite alternate;
    -webkit-animation: zoomout 1s ease-in-out infinite alternate;
    animation-iteration-count:1;
    -webkit-animation-iteration-count:1;
    /* background-attachment: fixed; */
}
#sub_vis.sub01:after{background-image: url(../img/sub_vis_bg1.jpg);}
#sub_vis.sub02:after{background-image: url(../img/sub_vis_bg2.jpg);}
#sub_vis.sub03:after{background-image: url(../img/sub_vis_bg3.jpg);}
#sub_vis.sub04:after{background-image: url(../img/sub_vis_bg4.jpg);}
#sub_vis.sub05:after{background-image: url(../img/sub_vis_bg5.jpg);}
#sub_vis.sub06:after{background-image: url(../img/sub_vis_bg6.jpg);}
#sub_vis.sub07:after{background-image: url(../img/sub_vis_bg7.jpg);}
#sub_vis.sub08:after{background-image: url(../img/sub_vis_bg8.jpg);}
#sub_vis.sub010:after{background-image: url(../img/sub_vis_bg10.jpg);}
#sub_vis.sub011:after{background-image: url(../img/sub_vis_bg10.jpg);}
#sub_vis h2 {
    font-size: 32px;
    color: #fff;
    font-weight: 700;
    /* text-shadow: 0 3px 6px rgba(0, 0, 0, 0.3); */
    position: relative;
    z-index: 1;
    /* text-align: left; */
}
#sub_vis h2 span {
    position: relative;
}
#sub_vis h2 span:after{
    display:block;
    clear:both;
    content:"";
    background: #e1252d;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    right: -12px;
    top: 25px;
    position: absolute;
    display: none;
}
#sub_vis h2 span:after,
#sub_vis h2 span:before {
    /* content: ''; */
    /* display: inline-block; */
    /* width: 1em; */
    /* height: 1em; */
    /* border: 0.5em solid #000; */
    /* border-radius: 50%; */
    /* position: absolute; */
    /* bottom: 0; */
}
#sub_vis h2 span:before {
    border-color: #e60012;
    opacity: 0.2;
    right: -2.5em;
    z-index: 0;
}
#sub_vis h2 span:after {
    /* border-color: #003894; */
    /* opacity: 0.4; */
    /* right: -4em; */
    /* z-index: 0; */
}
#sub_vis .depth{
    position: relative;
    z-index: 1;
    text-align: left;
    /* text-align: center; */
}
#sub_vis .depth li{
    display: inline-block;
    padding: 0 10px;
    font-size: 14px;
    position: relative;
    font-weight: 600;
    color: #e1e1e1;
    padding-right: 15px;
    margin-right: 15px;
    padding-left: 0px;
}
#sub_vis .depth li img{
    transform: translate(0px, 2px);
}
#sub_vis .depth li:last-child:after{
    display:none;
}
#sub_vis .depth li:after{
    display:block;
    clear:both;
    content:"";
    width: 4px;
    height: 4px;
    background: #fff;
    border-radius:50%;
    position: absolute;
    top: 8px;
    right: -5px;
}
#sub_vis .depth li a{}
.sub_vis_txt{
    color: #dadada;
    z-index: 10;
    position: relative;
    /* letter-spacing: 0.1px; */
    font-size: 12px;
    font-weight: 500;
    /* color: #00ADEC; */
}
@media all and (min-width:768px) {
    #sub_vis {
        padding: 101px 0;
        border-bottom: 0;
        padding-top: 135px;
        /* text-align: left; */
        padding-bottom: 65px;
    }
    #sub_vis h2 {
        font-size: 40px;
    }
    #sub_vis h2 span:after{
    top: 31px;
}
    #sub_vis .depth li{
    padding: 0px;
    /* padding: 0 11px; */
    font-size: 16px;
    padding-right: 15px;
    margin-right: 15px;
}
    #sub_vis .depth li img {
    transform: translate(0px, 3px);
}
    #sub_vis .depth li:after{
    top: 10px;
    right: -5px;
}
.sub_vis_txt{
    font-size: 16px;
}
}

@media all and (min-width:1200px) {
    #sub_vis {
        border-bottom: 0;
        padding: 87px 0;
        margin: 0;
        padding-top: 187px;
    }
    #sub_vis .pdinner{
    /* max-width: 1533px; */
}
    #sub_vis h2 {
        font-size: 50px;
        font-weight: 800;
        margin-bottom: 0px;
        text-align: left;
        text-align: center;
    }
    #sub_vis h2 span:after{
    top: 40px;
    width: 11px;
    height: 10px;
    right: -19px;
}
    .menu_wrap{
    /* bottom: -90px !important; */
}
.sub_vis_txt{
    font-size: 16px;
    /* text-align: left; */
}
}

#sub {
    margin: 0 auto;
    position: relative;
    min-height: 400px;
    padding: 40px 0 80px;
    /* overflow: hidden; */
}
#sub:after {
    content: '';
    clear: both;
    display: block;
}

/* 2depth menu */
#twodepthNav {
    position: relative;
    display: none;
    margin: 0 auto;
    background: #e7211a;
}
#twodepthNav ul {
    overflow: hidden;
    text-align: center;
}
#twodepthNav ul li {
    position: relative;
    width: 16%;
    display: inline-block;
    text-align: center;
    max-width: 150px;
}
#twodepthNav ul li a {
    color: #ffffff;
}
#twodepthNav ul.li09 li {
    width: 10.5%;
}
#twodepthNav ul li a {
    display: block;
    line-height: 60px;
    position: relative;
}
#twodepthNav ul li a:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 4px;
    background: #0083ef;
    transition: all 0.2s cubic-bezier(0.7, 0, 0.3, 1);
}
#twodepthNav ul li:hover a:after {
    width: 60px;
    margin-left: -30px;
}
#twodepthNav ul li a:hover {
    font-weight: 600;
    transition: 0.3s;
}
#twodepthNav ul li:first-child a:before {
    width: 0;
}
#twodepthNav ul li.active {
    background: #ffffff;
}
#twodepthNav ul li.active a {
    font-weight: 600;
    color: #323232;
}
#twodepthNav ul li.active a:after {
    width: 60px;
    margin-left: -30px;
}

#fl_menu {
    display: none;
}
.con {
    position: relative;
    min-height: 500px;
}
.sub_tit {
    font-size: 1.5em;
    font-weight: 800;
    color: #222;
    /* margin: 0 0 30px; */
    position: relative;
    border-bottom: 1px solid #dedede;
    text-align: center;
    padding-bottom: 30px;
    margin-bottom: 50px;
}
.sub_tit:after{
    display:block;
    clear:both;
    content:"";
    /* background: #e1252d; */
    width: 7px;
    height: 7px;
    border-radius: 50%;
    right: -11px;
    top: 19px;
    position: absolute;
}
@media all and (min-width:768px) {
    #sub {
        padding: 50px 0 80px;
    }
    .sub_tit {
        font-size: 2em;
        padding-bottom: 40px;
        margin-bottom: 70px;
    }
    .sub_tit:after{
    width: 10px;
    height: 10px;
    right: -17px;
    top: 36px;
}

    #twodepthNav {
        position: relative;
        display: block;
    }
}

@media all and (min-width:1200px) {
    .subwrap {
        margin: 0 auto;
    }
    .sub_tab {
        display: block;
        background: #0788c7;
        padding: 10px 0;
        text-align: right;
        color: #ffffff;
        font-size: 0.85em;
        text-align: right;
    }
    .sub_tab h3,
    .sub_tab p {
        display: inline-block;
        margin-left: 15px;
        color: #fbdf40;
        font-weight: bold;
    }
    .sub_tab h3 {
        color: #ffffff;
    }
    .sub_tab h3 span {
        margin-right: 10px;
        text-transform: uppercase;
        color: #fbdf40;
    }
    .sub_tab p {
        border-radius: 50px;
        background: #462e16;
        padding: 5px 10px;
    }

    #sub {
        position: relative;
        width: 100%;
        margin: 0 auto;
        min-height: 650px;
        padding: 100px 0 100px;
    }
    .con {
        width: 1160px;
        margin: 0 auto;
        min-height: 800px;
    }
    .sub_tit {
        font-size: 43px;
        /* margin-bottom: 40px; */
    }
    .sub_tit:after{
    top: 46px;
    width: 11px;
    height: 10px;
    right: -19px;
}

    #twodepthNav ul.li02 li {
        width: 25%;
    }
}

@media all and (min-width:1640px) {
    #sidemenu {
        display: block;
    }
    #fl_menu {
        display: block;
        position: absolute;
        right: 20px;
        z-index: 9999;
        width: 125px;
        top: 0;
        height: 600px;
    }
    #fl_menu .label {
        text-align: center;
        line-height: 80px;
        font-size: 18px;
        font-weight: bold;
        background: #29343f;
        color: #fff;
    }
    #fl_menu ul {
        text-align: center;
        padding: 10px 0 30px;
        background: #ffffff;
    }
    #fl_menu ul li a {
        font-size: 16px;
        font-weight: 600;
        padding: 8px 0;
    }
    #fl_menu ul li span {
        display: block;
    }
    #fl_menu .menu {
        display: block;
        border: 1px solid #dcdcdc;
    }
    #fl_menu .menu img {
        max-width: 60px;
    }
    #fl_menu .menu .menu_item {
        display: block;
        background: #ffffff;
        color: #323232;
    }
}

.menu_wrap {
    height: 46px;
    /* background: #fff; */
    /* border-bottom: 1px solid #dedede; */
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    bottom: 0px;
    width: 100%;
    z-index: 100;
}
/*컬러패스*/
#sub_drop {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    right: 0;
    background: #fff;
    font-size: 0.9em;
    border-bottom: 1px solid #dedede;
    border-top: 1px solid #dedede;
}
#sub_drop .inner:after {
    content: '';
    display: block;
    clear: both;
}
#sub_drop .home a {
    display: block;
    line-height: 45px;
    padding: 0 10px;
    background: #fff;
    display: none;
}
#sub_drop .home {
    min-width: 46px !Important;
    /* border: 0 !Important; */
    border-right: 1px solid #dedede;
    border-left: 1px solid #dedede;
}
#sub_drop .home img {
    display: inline-block;
    vertical-align: middle;
    max-width: 15px;
}
#sub_drop .dropdown {
    width: 100%;
    float: left;
    /* border-right: 1px solid #dedede; */
    /* border-color: rgba(255,255,255,0.2); */
    position: relative;
}
#sub_drop .dropdown.deph02 {
    min-width: 35%;
}
#sub_drop .dropbtn {
    width: 100%;
    text-align: left;
    display: inline-block;
    height: auto;
    position: relative;
    line-height: 45px;
    padding: 0 25px 0 10px;
    cursor: pointer;
    color: #444;
    font-weight: 600;
    display: none;
}
#sub_drop .dropbtn:after {
    font-family: 'FontAwesome';
    content: '\f107';
    position: absolute;
    right: 10px;
    color: #888;
    font-size: 14px;
    top: 0;
    bottom: 0;
    margin: auto;
    transition: 0.3s;
}
#sub_drop .dropdown.active a.dropbtn:after {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

#sub_drop .dropdown ul {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    -ms-overflow-style: none;
}
#sub_drop .dropdown ul li {
    /* padding: 5px 10px; */
}
#sub_drop .dropmenu {
    display: block;
    /* position: absolute; */
    z-index: 5;
    /* background: #ffffff; */
    /* border: 1px solid #dcdcdc; */
    box-sizing: content-box;
    /* left: -1px; */
    width: 100%;
    text-align: left;
}
#sub_drop .dropmenu a {
    display: block;
    line-height: 30px;
    color: #000000;
}
#sub_drop .dropmenu a:hover {
    color: #1eb9ee;
}
#sub_drop .dropdown > .dropmenu li {
    position: relative;
    display: inline-block;
}
#sub_drop .dropdown > .dropmenu li a {
    display: block;
    font-size: 14px;
    padding: 7px 15px;
}
#sub_drop .dropdown > .dropmenu li a.current{/* background: #23b8bc; *//* color:#fff; *//* background: #23b8bc; */position: relative;color: #222;font-weight: 700;}
#sub_drop .dropdown > .dropmenu li a.current:after{
    display:block;
    clear:both;
    content:"";
    width:50px;
    height: 3px;
    background: #339DFF;
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -25px;
}
#sub_drop .dropdown.active > .dropmenu {
    display: block;
}

#sub_drop:after {
    display: block;
    content: '';
    clear: both;
}

@media all and (min-width:768px) {
    #sub_drop{
    height: 60px;
    position: static;
}
    #sub_drop .dropbtn {
        padding: 0 25px 0 20px;
    }
    #sub_drop .dropdown ul{
    /* overflow: unset; */
}
    #sub_drop .dropdown ul li {
        /* padding: 5px 20px; */
        /* width: 16.66666666666667%; */
        /* border-right: 1px solid #dedede; */
        display: inline-block;
        padding: 0 42px;
    }
     #sub_drop .dropdown ul.list01 li{width:100%;}
     #sub_drop .dropdown ul.list02 li{/* width:50%; */}
     #sub_drop .dropdown ul.list03 li{/* width:33.3333333%; */}
     #sub_drop .dropdown ul.list04 li{width:25%;}
     #sub_drop .dropdown ul.list06 li{}
    #sub_drop .dropdown {
        /* min-width: 250px; */
        /* display: none; */
    }
    #sub_drop .home{display:none;}
    #sub_drop .dropdown.deph02 {
        min-width: 250px;
        display: block;
        width: 100%;
        /* display: flex; */
    }
    #sub_drop .dropmenu a {
        line-height: 50px;
        font-weight: 600;
        font-size: 16px;
    }
    #sub_drop .dropdown > .dropmenu li a{padding:0px;line-height: 60px;font-size: 19px;}
    #sub_drop .home a {
        line-height: 60px;
        min-width: 60px;
        text-align: center;
        padding: 0 20px;
    }
    #sub_drop .dropbtn {
        line-height: 80px;
        font-size: 18px;
        display: none;
    }
    #sub_drop .dropbtn:after {
        right: 15px;
        font-size: 24px;
    }
    #sub_drop .dropmenu{
    display: block;
    /* display: flex; */
    text-align: center;
    /* border-left: 1px solid #dedede; */
    background: none;
}

}

@media all and (min-width:1200px) {
    #sub_drop {
        font-size: 1em;
        /* display: none; */
        height: 70px;
    }

    #sub_drop .dropmenu {overflow: unset !important;}
    #sub_drop .dropbtn.has-focus,
    #sub_drop .dropdown.active a.dropbtn {background: #fff;border: 0;}

    #sub_drop .dropmenu a {color: #666;transition:0.3s;}
    #sub_drop .dropmenu a:hover {color: #339DFF}
    #sub_drop .dropdown > .dropmenu li:last-child{border-bottom:0px;}
    #sub_drop .dropdown > .dropmenu li a {line-height: 70px;}
}



/*main_board*/
.main_board .top{background: url(../img/main_top.jpg) center;position: relative;color: #fff;z-index: -1;}
.main_board .top:before{display:block; content:'';background: #373737ab;width: 100%;height: 100%;position: absolute;z-index: 0;}
.main_board .top .logo:before{display:block; content:''; background: url(../img/logo_w.png) no-repeat;width: 180px;height: 30px;background-size: 100%;margin: 0 auto;z-index: 1;}
.main_board .top .logo{padding-top:20px; border-bottom:1px solid #ffffff4f; padding-bottom:20px; position:relative}
.main_board .top .tit{padding:40px 0px;text-align: center;}
.main_board .top .tit p{font-weight: 700;color: #c0ea61;}
.main_board .top .tit h5{font-size: 2em;font-weight: 700;}

.searchTop.type02{padding-top:40px; /*! background: #fff; */}
.searchTop .list_info b{color:#339DFF;}
.searchBox form{background: #f8f8f8;display: block;padding: 5px 10px;height: 60px; border-radius: 50px}
.searchBox select{border:0px; background: #f8f8f8; border-right:1px solid #ddd;}
.searchBox span input{border:0px;background: #f8f8f8}
.searchBox button{border-radius: 50px;background: #339DFF;border-color: #339DFF;text-align: center;padding: 0;}
.board_view_top{padding-top:40px;/*! background: #fff; *//*! border-radius: 20px 20px 0px 0px; */}


@media all and (min-width:768px) {
.main_board .content{position: relative;/*! position: absolute; */width: 100%;top: -50px;background: #fff;}
.main_board .content .board_top{display: flex; flex-wrap:wrap; justify-content: space-between; align-items: flex-end;padding: 25px;background: #fff;border-radius: 20px;}
.main_board .board_list li{padding:30px 20px}
.main_board .board_list{background: #fff;margin: 0 25px;}
.main_board .top{height:280px;}
.main_board .top .tit{padding:40px 30px;}
.main_board .top .tit p{font-size:1.1em}
.main_board .top .tit h5{font-size: 2.5em;}
.main_board .top:after{display:block; content:''; background: url(../img/main_point.png) no-repeat; width:180px; height:80%;background-size: 100%;position: absolute;z-index: 1;bottom: 0;right: 50px;}
.searchBox form{padding: 8px 20px; }
}

@media all and (min-width:980px) {
  .main_board .top .logo{padding:25px 0px;}
  .main_board .top .logo:before{width:250px; height: 40px;}
  .main_board .top{height:330px;}
  .main_board .top .tit p{font-size:1.3em}
.main_board .top .tit h5{font-size: 3em;}
  .main_board .content{font-size:1.1em; position:relative; top:-50px; background: #fff;border-radius: 20px;padding: 40px;}
.main_board .searchTop.type02{padding:20px 20px 0px 20px; /*! border-radius: 20px */ }
.main_board .boardType01 ul.board_ul{margin: 0 20px 50px;}
.main_board .board_view_top{padding:40px 20px; }
}

@media all and (min-width:1200px) {
.main_board .content .board_top{padding:30px;}
  .main_board .top:after{width:230px; right:110px;}
  .main_board .top{height:400px;}
  .main_board .top .tit{padding:65px;}
  .main_board .top .tit h5{font-size: 3.2em;}
  .main_board .searchTop.type02{/*! padding:40px 30px 10px 30px; */ /*! border-radius: 20px */ }
.main_board .boardType01 ul.board_ul{margin: 0 30px 50px;}
.main_board .board_view_top{/*! padding:40px */}
.main_board .board_view_con{padding:40px}
}

@media all and (min-width:1700px) {
.main_board .top:after{width:230px; right:250px;}
}

@media all and (min-width:1900px) {
.main_board .top:after{right:330px;}
.main_board .content .board_top{padding:40px 30px;}
}

/* main */
#main {position: relative;}
#main .main_wrap {margin:70px 0 0; position:relative;}
/*#main .main_wrap:after{display:block; content:''; background: url(../img/wave_img.png)no-repeat; width:100%; height:50px;position: absolute;top: 0;}*/
#main .visual {width:100%; position:relative; z-index:0; background:#eee;}
#main .visual_wrap {width:100%;}
#main .visual dd {height:360px;}
#main .visual dd div.bg {display:inline-block; position:absolute; left:0; top:0; width:100%; height:100%; background-position:30% center; background-size:cover;}
#main .visual dd div.txt {position:relative; z-index:999; text-align:center; color:#fff; text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.5); line-height:1.2; padding-top:80px;}
#main .visual dd div.txt h3 {transition:0.2s; font-size:1em; font-weight:600; margin-bottom:10px; position: relative}
#main .visual dd div.txt h1 {transition:0.2s; font-size:1.8em; font-weight:700;font-family: 'ONE-Mobile-Title';}
#main .visual dd div.txt h1 span{color:#B6EC42;}
#main .visual .slick-active dd div.bg {animation:zoomout 2s ease-in-out infinite alternate; -webkit-animation:zoomout 2s ease-in-out infinite alternate; animation-iteration-count:1; -webkit-animation-iteration-count:1;}
#main .visual .slick-dots {position:absolute; left:0; bottom:0px; width:100%; text-align:center;z-index: -9;}
#main .visual .slick-dots li {display:inline-block; width:12px; height:12px; border-radius:500px; cursor:pointer; /*! background:rgba(255,255,255,0.5); */ margin:0 4px;}
#main .visual .slick-dots li.slick-active {/*! background:#5aae56; */}

#main .popup_bg {background:#9b9893; padding:0 0 40px; margin-top:-50px;}
#main .popup_wrap .popup #popup img {width:calc(100% - 20px); margin:0 10px; border-radius:10px;}
#main .popup .slick-dots {position:absolute; right:0; bottom:20px; width:100%; text-align:center;/*! padding-right: 20px; */}
#main .popup .slick-dots li {display:inline-block; width:12px; height:12px; border-radius:500px; cursor:pointer; background:rgba(255,255,255,0.5); margin:0 4px;}
#main .popup .slick-dots li.slick-active {background:#fff;}
#main .popup_wrap{border-radius: 20px;position: relative;}

#main .btns {margin:20px 0;}
#main .btns ul {max-width:400px; margin:0 auto;}
#main .btns li {display:inline-block; width:50%; float:left; text-align:center; padding:20px 0;}
#main .btns li img {width:80px; margin:0 0 10px;}
#main .btns li h3 {font-size:1.25em; font-weight:600;}
#main .btns li p {font-size:0.9em;}
#main{position:relative;}
#main .controls {position:absolute; left:-15px; bottom:70px; z-index:99; color:#fff; padding:0 3%; display:flex; align-items:center; width:100%; font-size:1.25em;}
#main .controls .dots {width:100px; text-align:center;}
#main .controls .dots li:not(.slick-active) {display:none;}
#main .controls .dots li{color:#aaa}
#main .controls .dots span {font-weight:800; color:#fff}
#main .controls .dots span:not(.slick-active) {font-size:1.2em; color:#fff}
#main .controls .dots span:after {content:'/'; margin:0 0.5em; font-weight:500; color:#aaa; font-size:0.8em;}

@media all and (min-width:768px) {
	#main .controls {bottom:200px}
  #main .controls .prev:before,
#main .controls .next:before {font-family:'xeicon'; cursor:pointer;}
#main .controls .prev:before {content:'\e93d';}
#main .controls .next:before {content:'\e940';}
	#main .visual dd {height:580px;}
	#main .visual dd div.bg {background-position:center center;}
	#main .visual dd div.txt {text-align:left; padding-top:150px;}
	#main .visual dd div.txt h3 {font-size:1.2em;margin-bottom: 20px;}
	#main .visual dd div.txt h1 {font-size:2.2em;}
	#main .visual .slick-dots {left:8.5%; /*! bottom:180px; */ text-align:left;}
	#main .visual .slick-dots li {width:16px; height:16px;}

	#main .section00 {background:none;}
	#main .popup_bg {width:320px; padding:0; background:none; float:none; position:absolute; right:3%; top:150px;}
	#main .popup_wrap {width:100%; max-width:320px;}

	#main .btns {width:100%; padding-top:0; margin:-100px auto 0; float:none; z-index:999;}
	#main .btns ul {max-width:100%; background:#fff; -webkit-box-shadow: 0px 5px 10px 0px rgb(0 0 0 / 10%); box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); border-radius:30px; overflow:hidden;}
	#main .btns li {width:25%; padding:20px 0;}
	#main .btns li img {width:80px;}
	#main .btns li h3 {line-height:40px;}
	#main .btns li p {line-height:20px;}
}

@media all and (min-width:980px) {
	#main .controls {bottom:320px}
	#main .visual .slick-dots {left:6.7%}
	#main .main_wrap {margin:0;}
	#main .visual dd {height:800px;}
	#main .visual dd div.txt {padding-top:220px;}
	#main .popup_bg {width:500px; top:180px;}
	#main .popup_wrap {max-width:500px;}
	#main .btns {margin:-100px auto 0;}
	#main .btns li h3 {font-size:1.5em;}
	#main .popup .slick-dots{text-align: right; top:20px;right: 30px;}
	#main .popup_wrap .popup #popup img {border-radius:20px;}
}

@media all and (min-width:1200px) {
		#main .controls {bottom:320px;}
	#main .visual dd div.txt h3{margin-bottom:30px;font-size: 1.5em;}
#main .visual dd div.txt h1 {font-size:3em;line-height: 1.3;}
}

@media all and (min-width:1400px) {
	#main .visual dd div.txt h3{width:500px;}
	#main .visual dd div.txt h3:after{display:block; content:''; width:100px; height:2px; background: #fff; position: absolute; right: -110px; bottom:5px}
	#main .visual dd {height:900px;}
	#main .visual dd div.txt h1 {font-size:3.8em;}
	#main .visual .slick-dots { left: 6%;}

	#main .popup_bg {right:calc(50% - 700px);top: 200px;}
	#main .popup .slick-dots li {width:15px; height:15px;margin: 0 5px;}
	
	#main .btns {margin:-80px auto 0;}
	#main .btns ul {height:160px; padding:0 20px;}
	#main .btns li {padding:40px 0 0 100px; text-align:left; position:relative; width:22.5%;}
  #main .btns li:nth-child(1) {width:25%;}
  #main .btns li:nth-child(2) {width:30%;}
	#main .btns li img {position:absolute; left:0; top:40px; margin:0;}
	#main .btns li h3 {line-height:50px; font-size:1.75em;}
  #main .btns li:hover h3 {color:#2a6334;}
	#main .btns li h5 {line-height:20px;}
}

@media all and (min-width:1600px) {
 #main .controls {left:calc(50% - 750px);}
 #main .visual .slick-dots { left: 5.6%;}
#main .popup_wrap:before{display:block; content:''; background: url(../img/popup_point.png)no-repeat; background-size: 100%; width: 20px; height:170px; position: absolute; right: -30px; bottom:0; }
}

@media all and (min-width:1900px) {
 #main .visual .slick-dots { left: 5.2%;}
}

/*footer*/
#footer{ font-size:0.9em;  padding:20px 0 40px;background: #0A0C35;color: #ddd;letter-spacing: -0.05em;}
#footer .pdinner{max-width:1400px;margin: 0 auto;}
#footer .bottom_li .pdinner{}

#footer p{font-size:0.85em; clear:both; margin-top:30px; color:#999;}
#footer address b{color:#464646;margin-right: 5px;font-weight: 800;}

.bottom_li { margin:0 0 30px;border-bottom: 1px solid #dddddd36;padding-bottom: 20px;}
.bottom_li li {display:inline-block; margin:0 0.5em; position:relative; line-height:20px;}
.bottom_li li:first-child:before {display:none;}
.bottom_li li a { font-weight:700;}
#footer .f_logo{display:none}

@media all and (min-width:768px) {
  #footer  {padding:25px 0px 60px;}
  #footer .footer_wrap {display:flex; /*! flex-direction:row-reverse; */ /*! justify-content:space-between; */ align-items:flex-start;gap: 5%;}
  #footer .footer_wrap .lbox {text-align:left;}
  .bottom_li {text-align:left;margin: 0 0 50px;}
  .bottom_li li {margin:0 3em 0 0;}
	#footer .logo{display:block;float: right;}
	#footer .logo img{width:200px;}
	#footer .sns {justify-content:right;}
	#footer .footer_wrap .rbox{width: 25%;}
	#footer .footer_wrap .lbox{width: 70%;}
  #footer .f_logo{display:block; width:100px;position: absolute;right: 20px;bottom: 0px;}
  
  #footer .f_info li:nth-child(2){display: flex;}
  #footer .f_info li i{margin: 0 20px;position: relative;display: block;}
  #footer .f_info li i:before{display:block; content:''; width:1px; height:12px; background: #ffffff3b; position: absolute;left: 0;top: 5px;}
}

@media all and (min-width:1080px) {
  #footer  {font-size:1em;}
  #footer .footer_wrap .rbox {/*! display:flex; */ /*! align-items:center; */}
  #footer .footer_wrap .rbox  .drop {margin:0;}
}

@media all and (min-width:1200px) {
 	#footer .logo img{width:300px;}
	#footer .sns {margin:0 0 60px;}
}

@media all and (min-width:1280px) {
  #footer {/*! padding:80px 0px 60px; */}
}



/* ==== Slider Image Transition === */
@-webkit-keyframes ProgressDots{from{width:0px;}to{width:100%;}}
@keyframes ProgressDots{from{width:0px;}to{width:100%;}}

@-webkit-keyframes scaling {	From {    -webkit-transform: scale(1.1);}	To {    -webkit-transform: scale(1.0);}}


/* ==== Slick Slider Css Ruls === */
.slick-slider{position:relative;display:block;
-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-list:focus{outline:none}.slick-list.dragging{cursor:hand}

.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.slick-track{position:relative;top:0;left:0;display:block}
.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}

.slick-loading .slick-track{visibility:hidden}
.slick-slide{display:none;float:left /* If RTL Make This Right */ ;height:100%;min-height:1px}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}

.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}





/*section공통*/
.sec_tit{margin-bottom:20px;position: relative;}
.sec_tit h4{font-family: 'ONE-Mobile-Title';font-size: 1.5em;}
.sec_tit p{margin-top:10px;}
a.btn{background: #f8f8f8; padding:10px 55px 10px 20px;border-radius: 50px; font-weight:600; position: relative;position: absolute;right: 0;top: 0;display: block;color: #999;}
a.btn:after{display: block; content:''; color:#fff; font-family:var(--icon); font-weight:300; font-size:35px; line-height: 45px;text-align: center; cursor:pointer;content:'\e5cc'; width:40px; height:40px; background: var(--main_color); right:0; top:0; position:absolute; border-radius:50%}
a.btn:hover{color:var(--main_color)}

@media all and (min-width:768px) {
.sec_tit h4{display:inline-block;}
.sec_tit p{display:inline-block; margin-left:20px;font-size: 1.1em;}
}

@media all and (min-width:980px) {
.flex_box{display:flex; flex-wrap: wrap;}
.sec_tit h4{font-size:1.8em}
}

@media all and (min-width:1200px) {
.flex_box{display:flex; flex-wrap: wrap;}
.sec_tit h4{font-size:2em}
.sec_tit p{margin-left:30px;font-size: 1.2em;}
a.btn:after{width:45px; height:45px; line-height: 50px;font-size: 40px;}
}



/*메인영상*/
/*section - visual*/

.main_visual {overflow: hidden;position: relative;}
.main_visual_slider {/*! height: calc(80vh - 70px); */}
.main_visual .swiper-pagination { text-align: center; width: 150px !important; margin-left: 0px; top: 50% !important; margin-left: -50px !important;left: 10% !important;}
.main_visual .swiper-button-next,
.main_visual .swiper-button-prev{color:#fff; opacity:1 !important; position:static;width:20px;height:20px;margin:0;}

.main_visual .swiper-button-next:after{content:''; display:block; width:1px; height:20px; background:#fff; opacity:0.2; left:50%; position:absolute;}
.main_visual .slider_controls{display:flex;align-items:center;justify-content:center;gap:12px;position:relative;bottom:-30px;left:45%;transform:translateX(-50%);z-index:10;left: 150px;}

.main_visual .swiper-pagination .swiper-pagination-bullet { color: #dedddd; opacity: 1; background: none; display: inline-block; font-weight: 600; width: 10px; height: 10px; background: #fff; border-radius: 50%; font-size:0px; margin: 0px 9px !important; opacity: 0.4;}
.main_visual .swiper-pagination .swiper-pagination-bullet:after {}.main_visual .swiper-pagination .swiper-pagination-bullet-active { opacity: 1;  width: 10px; position: relative; text-align: left;}
.main_visual .swiper-pagination .swiper-pagination-bullet-active:after {opacity: 1;}
.main_visual .swiper-slide { background-position: center !important; background-size: cover !important;}
.main_visual .swiper-slide.swiper-slide-active:after {transform: scale(1.1) !important;}
.main_visual .swiper-slide:after {
    transition: 3s 1.5s;
    display: block;
    clear: both;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-size: cover !important;
    background-position: center !important;
    animation-fill-mode: forwards;
}
.main_visual .m1:after {background: url("/img/main_vs1.jpg");}
.main_visual .m2:after {background: url("/img/main_vs2.jpg");}
.main_visual .m3:after {background: url("/img/main_vs3.jpg");}
.main_visual .text {
    position: relative;
    z-index: 999;
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -90px;
    font-family: 'A2z';
    color: #fff;
}
.main_visual .text:before {
    display: block;
    width: 0;
    height: 3px;
    background: #ed1423;
    margin: 0 auto 15px;
    transition: 0.5s;
    transition-delay: 0.5s;
}
.main_visual .swiper-slide-active .text:before {width: 26px;}
.main_visual .text .t1 span em {font-weight: 300;letter-spacing: -0.5px;}
.main_visual .swiper-slide-active .text span em.tn1,
.main_visual .swiper-slide-active .text span em.tn2,
.main_visual .swiper-slide-active .text span em.tn3,
.main_visual .swiper-slide-active .text span em.tn4 {
    -webkit-animation-name: main-text-animation;
    animation-name: main-text-animation;
    display: block;
    animation-duration: 1.5s;
    -webkit-animation-duration: 1.5s;
    animation-iteration-count: 1;
}
.main_visual .swiper-slide-active .text em.tn1 {animation-delay: 0.6s;}
.main_visual .swiper-slide-active .text em.tn2 {animation-delay: 0.9s;}
.main_visual .swiper-slide-active .text em.tn3 {animation-delay: 1.2s;}
.main_visual .swiper-slide-active .text em.tn4 {animation-delay: 1.4s;}
.main_visual .text .t1 {
    color: #F3F3F3;
    font-size: 14px;
    line-height: 1.1;
    margin-bottom: 15px;
    text-align: center;
    display: block;
}
.main_visual .text .t1 span {
    overflow: hidden;
    display: block;
    line-height: 1.2;
}
.main_visual .text .t2 span img{width: 120px;margin-top: 10px;}
.main_visual .text .tn1,
.main_visual .text .tn2,
.main_visual .text .tn3,
.main_visual .text .tn4 {
    animation-fill-mode: backwards;
}

.btn_pause {
    position: absolute;
    bottom: 51px;
    z-index: 10;
    left: 50%;
    font-size: 0;
    width: 30px;
    height: 30px;
    /* background: red; */
    margin-left: 36px;
}
.btn_pause:before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 9px;
    height: 8px;
    left: 10px;
    top: 11px;
    border-left: 3px solid #fff;
    border-right: 3px solid #fff;
}
.btn_pause.on:before {
    display: none;
}
.btn_pause.on:after {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 0;
    height: 11px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 9px solid #fff;
    top: 9px;
    left: 10px;
    /* left: 50%; */
    /* margin-left: 220px; */
}

.main_visual .swiper-pagination-bullet-active .page-progress:after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: auto;
    height: 2px;
    background: #009fe3;
    animation: page-progress-ani 3.5s ease 0s 1 normal forwards;
}
.main_visual .swiper-pagination-bullet-active .page-progress {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 27px;
    width: 90px;
    /*0.2vw*/
    height: 2px;
    margin-right: 0.8vw;
    background-color: #ffffff;
    display: none;
}
.main_visual .swiper-pagination-bullet-active {
    /* width: 90px; */
    font-family: 'Montserrat', sans-serif;
    color: #dedddd;
    font-weight: 600;
}
@keyframes page-progress-ani {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}
.scroll_down {
    display: block;
    position: absolute;
    bottom: -10px;
    left: 50%;
    z-index: 10;
    transform: scale(0.7);
    margin-left: -38px;
    display: none;
}
.scroll_down .txt {
    color: #f1f1f1;
    font-size: 14px;
    font-weight: 500;
    margin-top: 10px;
    display: block;
    text-align: center;
}

.swiper-page-area {
    position: absolute;
    /* left: 0px; */
    top: 60%;
    width: 100%;
    left: 0px;
    margin-left: 0px;
    /* bottom: 50px; */
}
.page_inner {
    /* background: red; */
    /* height: 10px; */
}



.slide_btns {
    position: absolute;
    bottom: 1px;
    z-index: 200;
    left: 198px;
}
.slide_btns button {
    background: none;
    border: none;
    font-size: 0;
    width: 19px;
    height: 19px;
    /* background: red; */
}
.slide_btns .start {}

.mv-txt-list{position: absolute;bottom: 0;z-index: 20;color: #fff;width: 100%;}
.mv-txt-list ul{
    display: flex;
    /*! align-items: center; */
    justify-content: space-between;
}
.mv-txt-list ul:after{
    display:none;
}
.mv-txt-list li{width: 33.3333%;text-align: center;border-top: 1px solid #ffffff50;padding: 12px 0;border-right: 1px solid #ffffff50;}
.mv-txt-list li:last-child{border-right:0px;}
.mv-txt-list .img{height: 41px;display: flex;align-items: center;justify-content: center;}
.mv-txt-list .img img{
    transform: scale(0.5);
}
.mv-txt-list li:nth-child(1) .img img{/* transform: scale(1); */}
.mv-txt-list li:nth-child(2) .img img{}
.mv-txt-list li:nth-child(3) .img img{
}
.mv-txt-list .txt{
    font-size: 14px;
    font-size: 0px;
}
.mv-txt-list .txt b{
    font-weight: 700;
    display: block;
    font-size: 16px;
}

@media all and (min-width:768px) {
    .main_visual .text .t2 span img{width: 200px;margin-top:10px;}
   .main_visual .slider_controls{left: 200px;}
    .main_visual .text:before {width: 0;height: 5px;}
    .main_visual .swiper-slide-active .text:before {width: 45px;}
    .main_visual .text {margin-top: -105px;}
    .main_visual .text .t1 {font-size: 20px;margin-bottom: 25px;}
    .main_visual .text .t1 span {display: block;overflow: hidden;line-height: 1.5;}
    .main_visual .text .t2 {font-size: 50px;}
    .scroll_down {display: block;position: absolute;bottom: 50px;/* left: 50%; */z-index: 10;/* margin-left: -11.5px; */width: 100%;transform: scale(1);margin-left: 0px;left: 0;}
    .scroll_down .txt {text-align: center;}
    .swiper-page-area {margin-top: 41px;}
}

@media all and (min-width:980px) {
  .main_visual .slider_controls{left: 220px; top:33px;}
  .main_visual .text .t2 span img{width: 200px;margin-top:10px;}
}

@media all and (min-width:1200px) {
.main_visual .text .t2 span img{width: 250px;margin-top:20px;}
    .main_visual:before{content:"";position:absolute;top:0;left:0;width:50%;height:100%;background:linear-gradient(120deg, rgba(51,157,255,0.5) 0%, rgba(51, 157, 255, 0) 50%);z-index:9;pointer-events:none;}
    
}


@media all and (min-width:1280px) {
    .main_visual_slider {/*! height: 100vh; */}
    .main_visual .swiper-slide {/*! height: 100vh; */position: relative;}
    .main_visual .text {max-width: 1280px;margin: 0 auto;padding-top: 0;height: 300px;position: absolute;top: 50%;left: calc(50% - 640px);margin-top: -180px;}
    .main_visual .text:before {margin: 0 0 29px;}
    .main_visual .text .t1 {font-size: 20px;text-align: left;display: block;}
    .main_visual .text .t2 {font-size: 76px;text-align: left;margin-bottom: 25px;line-height: 1.3;}
   
    .btn_pause {text-align: left;left: calc(50% - 640px);top: 50%;margin-top: 172px;margin-left: 101px;margin-left: 71px;}
    .swiper-page-area {top: 50%;/* margin-left: -173px; */margin-top: -49px;left: unset;right: 50%;margin-right: -710px;}
    .slide_btns { left: -158px; bottom: 3px;}
    .slide_btns .start:after {height: 12px;width: 11px;}
    .main_visual .swiper-pagination .swiper-pagination-bullet {font-size: 20px;width: 35px;width: 10px;height: 10px;font-size: 0px;display: block;margin-bottom: 35px !important;position: relative;z-index: 1999;}
    .main_visual .swiper-pagination-bullet-active .page-progress:after {height: 3px;transform: none;top: 0;}
}


.video_wrap:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(10,12,53,0.5);z-index:1;}
.video_wrap #video {width: 1200px;height: 650px;margin: -50px 0 0 calc(50% - 600px);z-index:-1;}
.main_visual .swiper-slide.m4:after{z-index: 99;bottom: 0;height: 100%;background: linear-gradient(to bottom, #00000000, #0000005e);}

@media all and (min-width:800px) {
.video_wrap #video {width:1300px;height: 700px;margin:-50px 0 0 calc(50% - 650px);}
}

@media all and (min-width:950px) {
.video_wrap #video {width: 1543px;height: 800px;margin: -64px 0 0 calc(50% - 700px);}    
}

@media all and (min-width:1200px) {
.video_wrap #video {width: calc(100vw + 1040px); height: calc(100vh + 1040px); margin: -520px 0 0 -520px;}
}

/*@media all and (min-width:1200px) {
.video_wrap #video {width: 1800px;height: 1400px;margin: -200px 0 0 calc(50% - 800px);}
}

@media all and (min-width:1400px) {
.video_wrap #video {width: 2000px;height: 1300px; margin: -220px 0 0 calc(50% - 800px);}
}

@media all and (min-width:1600px) {
.video_wrap #video {width: 2100px;height: 1300px; margin: -220px 0 0 calc(50% - 1000px);}
}
@media all and (min-width:3300px) {
.video_wrap #video {width: calc(100vw + 1200px); height: calc(100vh + 1040px); margin: -520px 0 0 -600px;}
}*/


/*
@media all and (min-width:2300px) {
.video_wrap #video {width: 5000px; height: 1800px; margin: -520px 0 0 calc(50% - 2500px);}
}

@media all and (min-width:3200px) {
.video_wrap #video {width: 6000px; height: 2200px; margin: -300px 0 0 calc(50% - 3000px);}
}*/



/*section02*/
.tEnter{display: block;}
.section.pd{padding:50px 0px}
.sect02{background: #0A0C35;color: #fff;}
.sect02{position:relative;}
.sect02:before{content:""; position:absolute; top:0; right:0; width:100%; height:100%; background:linear-gradient(225deg, rgba(51, 157, 255, 0.39) 0%, rgba(51, 157, 255, 0) 20%, rgba(51, 157, 255, 0) 50%); z-index:1; pointer-events:none;}

.section .toptxt{text-align:center;margin-bottom: 40px;position: relative;}
.section .toptxt p{font-weight: 500; margin-bottom:10px}
.section .toptxt h3{font-size: 1.3em;font-family: 'A2z';font-weight: 700;}
.section .toptxt h3 b{color: #083d8b;font-weight: 700;}
.section .toptxt h3 img{width: 70px;}

.sect02 .content{}
.sect02 .content ul{}
.sect02 .content li{box-sizing: border-box; border: 1px solid rgba(0, 117, 255, 0.60); border-radius: 20px; box-shadow: 0px 0px 30px 0px rgba(38, 121, 233, 0.80); padding: 20px; counter-increment: solNum;  overflow: hidden;  position: sticky; top: 100px; left: 0;background: #0a0c35;margin-bottom: 20px;}
.sect02 .content li .txt i{font-weight: 600;opacity: 0.4;font-size: 0.9em;}
.sect02 .content li .txt p{font-size: 1.2em;font-weight: 600;margin-bottom: 15px;}
.sect02 .content li .txt h5{display: flex;flex-wrap: wrap;align-items: center;font-weight: 700;font-family: 'A2z';font-size: 1.3em;margin-bottom: 20px;}
.sect02 .content li .txt h5 img{width: 80px; margin-right: 15px}
.sect02 .content li .txt em{opacity: 0.9; margin-bottom:20px; display: block;}
 .sect02 .content li .img img{border-radius:10px; }
.sect02 .content li .txt a{position:relative; display: block; width:130px; border:1px solid #fff; padding:7px 20px; border-radius: 50px; opacity: 0.5;margin: 20px 0px 30px;}
.sect02 .content li .txt a:after{display:block; content:'\f8ce';  font-family: var(--icon); position: absolute; right: 15px; top:5px; font-size:20px;}
.sect02 .content li .txt a:hover{background:#339DFF; opacity:1; border: 1px solid #339DFF;}

@media all and (min-width:768px) {
.tEnter{display: inline-block;}
  .section.pd{padding:80px 0px}
  .sect02 .content li{display:flex; flex-wrap:wrap;justify-content: space-between;align-items: center;padding: 70px 50px 60px;}
  .sect02 .content li .txt{width:60%;position: relative;}
  .sect02 .content li .img{width:40%;}
  .sect02 .content li .txt a{margin-bottom:0px;}
  .sect02 .content li .txt i{position:absolute; left:-20px; top:-40px;}
  .sect02 .content li .txt h5{font-size:1.6em; margin-bottom:20px;}
  .sect02 .content li .txt em{margin-bottom:50px;font-size: 1.1em;}
  
  .section .toptxt p{font-size: 1.1em;}
.section .toptxt h3{font-size: 1.6em;}
  .section .toptxt h3 img{width: 80px;}
}

@media all and (min-width:1200px) {
  .section.pd{padding:100px 0px}
  .sect02 .content li .txt{width:50%}
  .sect02 .content li .img{width:50%;}
  .sect02 .content li{padding: 80px 60px 60px;margin-bottom: 30px; top: 150px;}
  .sect02 .content li .txt h5{font-size:2em; margin-bottom:20px;}
  .sect02 .content li .txt h5 img{width: 100px;}
    .section .toptxt p{font-size: 1.3em;}
.section .toptxt h3{font-size: 2em;}
  .section .toptxt h3 img{width: 120px;}
  .section .toptxt{margin-bottom: 60px;}
  .sect02 .content li .txt i{position:absolute; left:-20px; top:-50px;font-size: 1.2em;}
  .sect02 .content li .txt a{width:150px;}
}

@media all and (min-width:1500px) {
  .section.pd{padding:120px 0px}
  .section .toptxt h3{font-size: 2.2em;}
  .section .toptxt h3 img{width: 140px;}
  .sect02 .content li{padding: 80px 80px 60px;}
  .sect02 .content li .txt i{left:-30px; top:-70px;}
  .sect02 .content li .txt h5 img{width: 120px;}
  .sect02 .content li .txt p{font-size: 1.4em;}
}

:root {
  --icon:'Material Symbols Outlined', sans-serif;
}


/*section03*/
.sect03{background: #0A0C35;color: #fff; position:relative; padding-top:0px !important;}
.sect03:before{display:block; content:''; background:url(../img/sec03_bg.png) no-repeat center bottom; background-size:cover; width:100%;height: 100%;position: absolute;}
.sect03 .ico_box{display: flex;flex-wrap: wrap;}
.sect03 .ico_box li{width:100%}
.sect03 .ico_box a{box-sizing: border-box;border-radius: 15px;box-shadow: 0px 0px 30px 0px rgba(38, 121, 233, 0.80);padding: 70px 25px 25px;counter-increment: solNum;overflow: hidden;background: #0a0c35;margin-bottom: 20px;display: block;position: relative;}
.sect03 .ico_box a:after{display:block; content:''; background: #339DFF url(../img/main_ico01.png); position: absolute; width:40px; height:40px; border-radius: 50px; background-size: 100%;right: 25px;top: 25px;}
.sect03 .ico_box a:before{display:block; content:''; background: #339DFF5C; position: absolute; width:40px; height:40px; border-radius: 50px; background-size: 100%;right: 40px;top: 25px;}
.sect03 .ico_box a.i02:after{background: #339DFF url(../img/main_ico02.png); background-size:100%}
.sect03 .ico_box a.i03:after{background: #339DFF url(../img/main_ico03.png); background-size:100%}
.sect03 .ico_box a h4{font-family: 'A2z';font-size: 1.1em;font-weight: 600;margin-bottom: 7px;}
.sect03 .ico_box a:hover{background:#339DFF}
.sect03 .ico_box a:hover:after{background: #0A0C35 url(../img/main_ico01.png); background-size: 100%}
.sect03 .ico_box a.i02:hover:after{background: #0A0C35 url(../img/main_ico02.png); background-size:100%}
.sect03 .ico_box a.i03:hover:after{background: #0A0C35 url(../img/main_ico03.png); background-size:100%}
.sect03 .ico_box a:hover:before{background: #0A0C35; opacity: 0.4}

@media all and (min-width:768px) {
  .sect03 .ico_box{gap:2%}
  .sect03 .ico_box li{width:32%}
  .sect03 .ico_box a{margin:0; position:relative; top:20px}
  .sect03 .ico_box li:nth-child(2) a{top:0}
}

@media all and (min-width:1200px) {
  .sect03 .ico_box{gap:3%}
  .sect03 .ico_box li{width:31.33%}
  .sect03 .ico_box a{margin:0; position:relative; top:20px; padding: 80px 35px 35px;}
  .sect03 .ico_box li:nth-child(2) a{top:0}
  .sect03 .ico_box a h4{font-size: 1.3em;}
  .sect03 .ico_box a p{font-size:1.1em}
  .sect03 .ico_box a:after{width:50px; height:50px; right: 35px;top: 35px;}
.sect03 .ico_box a:before{width:50px; height:50px; right: 60px;top: 35px;}
}


/*sect04*/
.sect04 .contact{position: relative;background: url(../img/contact_bg.jpg) no-repeat;border-radius: 15px;padding: 20px;color: #fff;}
.sect04 .contact .left{}
.sect04 .contact .left h1{font-family: 'A2z'; font-size:1.5em; font-weight:600;}
.sect04 .contact .left p{font-size:1.1em; font-weight:600}
.sect04 .contact .left a{position: relative;display: block;width: 130px;border: 1px solid #fff;padding: 7px 20px;border-radius: 50px;opacity: 0.5;margin: 20px 0px 0px;}
.sect04 .contact .left a:after{display:block; content:'\f8ce';  font-family: var(--icon); position: absolute; right: 15px; top:5px; font-size:20px;}
.sect04 .contact .left a:hover{background:#339DFF; opacity:1; border: 1px solid #339DFF;}
.sect04 .contact .right{display: none;}

.sect04 .notice_li{position:relative; cursor:pointer;padding: 0 3%;}
.sect04 .notice_li button{position: absolute !important; top:-80px;right: 10px;}
.sect04 .notice_li .slick-arrow.slick-next{right:60px;}
.sect04 .notice_li .slick-arrow{background: #F2F2F2;border: 0px; /*! position:relative; */width: 40px;height: 40px;color: #fff0;border-radius: 50px; }
.sect04 .notice_li .slick-arrow:before{left: 15px;position: absolute;}
.sect04 .notice_li .slick-arrow:hover{background:#ddd;}
.sect04 .notice_li .slick-arrow.slick-prev:before{display:block; content:'\e5e1'; font-family: var(--icon);color: #969696;}
.sect04 .notice_li .slick-arrow.slick-next:before{display:block; content:'\e5e0'; font-family: var(--icon);color: #969696;}
.sect04 .toptxt a{position: relative;display: block;width: 130px;border: 1px solid #8C8C8C;padding: 7px 20px;border-radius: 50px;opacity: 0.5;margin: 20px 0px 0px;text-align: left;}
.sect04 .toptxt a:after{display:block; content:'\f8ce';  font-family: var(--icon); position: absolute; right: 15px; top:5px; font-size:20px;}
.sect04 .toptxt a:hover{background:#339DFF; opacity:1; border:0px; color:#fff}
.sect04 .notice_li img{display:block; border-radius: 10px}
.sect04 .notice_li .txt{margin-top: 20px;position: relative; }
.sect04 .notice_li .txt h5{font-size: 1.1em;font-weight: 700;color: #333;width: 90%;}
.sect04 .notice_li .txt p{color: #848484;font-size: 0.95em;font-weight: 500;margin-top: 5px;}
.sect04 .notice_li .txt a{width: 35px;height: 35px;display: block;background: #AFAFAF;border-radius: 50px;position: absolute;bottom: 0px;right: 0;}
.sect04 .notice_li .txt a:after{display: block; content: '\f8ce'; font-family: var(--icon); position: absolute; right: 8px; top: 4px; font-size: 20px;color: #fff;}
.sect04 .notice_li .txt:hover a{background:#339DFF; }

@media all and (min-width:500px) {
.sect04 .notice_li .slick-slide{padding:0 10px;}
.sect04 .notice_li{margin:0 -10px;}
  .sect04 .notice_li button{right: 30px;}
  .sect04 .notice_li .slick-arrow.slick-next{right:80px;}
}

@media all and (min-width:768px) {
  .sect04 .contact{padding: 30px 50px; display:flex; flex-wrap:wrap;justify-content: space-between;align-items: flex-end;}
  .sect04 .contact .right{display: block; width:50%; text-align:right;}
  .sect04 .contact .left{width:50%}
  .sect04 .contact .right img{width: 80px;}
  .sect04 .toptxt a{position: absolute;right: 120px;bottom: 0;}
}

@media all and (min-width:1200px) {
  .sect04 .contact{padding: 50px 70px;}
  .sect04 .contact .left h1{font-family: 'A2z'; font-size:2em; font-weight:600;margin-bottom: 3px;}
  .sect04 .contact .left a{margin-top:30px;width: 150px;}
  .sect04 .contact .right img{width: 100px; margin-bottom:5px;}
  .sect04 .contact .left p{font-size:1.2em}
  .sect04 .notice_li button{top:-100px;}
  .sect04 .notice_li{padding: 0 20px;}
}

@media all and (min-width:1500px) {
  .sect04 .contact{padding: 60px 100px;}
  .sect04 .notice_li .slick-slide{padding:0 20px;}
.sect04 .notice_li{margin:0 -20px;}
}