.relative{position:relative;width:1080px;margin:0 auto;}
.relative .box{position:relative;width:100%;border-left:2px solid #efefef;margin-top:100px}
.relative .box .left_text{position:absolute;top:0;left:-35px}
.t1{font-size:66px;font-weight:bold;color:#F7941D}

.content_lst{margin-bottom:100px}
.content_lst li{position:relative;float:left;}
.content_lst li:nth-child(1){margin-top:-8px;padding-left:25px;width:350px;font-size:36px;font-weight: bold;color:#ABA7A2;line-height:47px}
.content_lst li:nth-child(2){width:700px}
.content_lst li>div{float:left;border-top:8px solid #211F1D;width:320px;padding:15px 0;margin-bottom:50px}
.content_lst li>div:nth-child(2){margin-left:58px}
.content_lst li>div p{font-size:32px;height:105px;line-height:38px;font-weight:bold;color:#211F1D;letter-spacing:-1px}
.content_lst li>div table{width:100%;}
.content_lst li>div table td{font-size:16px;line-height:28px;color:#646464;vertical-align:top;padding-right:4px}
.content_lst:after{display:block;content:"";clear:both}

.content_lst li>p{font-size:16px;width:420px}
.content_lst li>p.shape{position:absolute;top:0;right:-20%}

/* .sec1{position:relative;background:#F7941C;padding:190px 0 460px 0;overflow:hidden} */
.sec1{position:relative;padding:200px 0;overflow:hidden;
    /* background-image: linear-gradient(to right, #f0d427 , #f1722c); 애니메이션 거부했을 시 이거 쓸 것.*/

    background: linear-gradient(to right, #f0d427, #f1722c);
    background-size: 160% 160%;
    -webkit-animation: AnimationName 10s ease infinite;
    -moz-animation: AnimationName 10s ease infinite;
    animation: AnimationName 10s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.sec1 .relative{margin-top:100px;z-index:10;width:auto;max-width:1400px}
.sec1 .p1{position:relative;font-size:117px;line-height:120px;letter-spacing:-4px;color:#fff;font-family: 'Arial';z-index:10}
.sec1 .p2{font-size:18px;line-height:38px;color:#fff;margin-top:20px}
.sec1 .p3{text-align:right;font-size:20px;line-height:32px;color:#fff;}
.sec1 .p3 span{display:inline-block;width:1px;height:16px;margin:0 5px;background:#fff;vertical-align:-1px}
.sec1 .p4{text-align:right;font-size:24px;font-weight:600;line-height:32px;color:#fff;margin-top:110px;}
.sec1 .p4 span{display:inline-block;width:1px;height:16px;margin:0 5px;background:#fff;vertical-align:-1px}
.sec1 .p5{text-align:right;font-size:16px;line-height:24px;color:#fff;margin-top:20px;}
.sec1 .main_bar{width:1px;height:180px;background:#fff;position:absolute;left:0;top:300px;}

/* .sec1 ul{margin-top:170px}
.sec1 ul li{position:relative;width:25%;float:left;color:#FFECD5;font-size:20px;text-align:center;}
.sec1 ul li span{display:block;font-size:40px;font-weight:bold;color:#fff}
.sec1 ul li:nth-child(1),.sec1 ul li:nth-child(2),.sec1 ul li:nth-child(3){background:url('/image/site/shape.png')no-repeat;background-position:right 70%} */
/* .sec1 .story_image{position:absolute;top:-40px;right:0;z-index:1}
.sec1 .story_image .img2{position:absolute;top:-30px;left:-30px;animation-duration: 4s;animation-name: slidein;} */

.sec1 .story_image_wrap{position:absolute;top:-60px;right:0;z-index:1}
.sec1 .story_image_twinkle{width:410px;height:371px;background:url("/image/site/M.png") center no-repeat;position:relative;}
.sec1 .story_image_twinkle img{position:absolute;}
.sec1 .story_image_twinkle>div{visibility:hidden !important;opacity:0 !important;transition:all 1s ease-out}
.sec1 .story_image_twinkle>div.view_twinkle{visibility:visible !important;opacity:1 !important}

@keyframes slidein
{
    from{left:0px;top:0px;}
    to{left:-30px;top:-30px;}
}

.sec1 canvas {
display:none;
position:absolute;top:0;left:0;
width: 100%;
height: 100%;
}

.sec1 .circle_box{display:block;position:absolute;bottom:-200px;left:50%;margin-left:-715px;width:1430px;height:1454px;opacity:0.5;background:url('/image/site/cir_bg.png')no-repeat center;background-size:cover;z-index:1}
.sec1 .sec1_world{margin-bottom:-1059px;margin-top:100px;z-index:30}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .sec1 canvas {display:block !important}
    .sec1 .circle_box{display:none !important}
}


.sec2{position:relative;padding-top:150px;overflow:hidden}
.sec2 .effect{position:absolute;right:0;bottom:0;z-index:-1}

.sec3{position:relative;background: #F8F8F8;padding:150px 0;overflow:hidden}
.sec3 .effect{position:absolute;left:0;bottom:0;z-index:1}
.sec3 .cont{padding-left:25px;z-index:10;position:relative;}
.sec3 .cont:last-child{margin-top:80px}
.sec3 .cont .img_cont{text-align:center;float:left;width:336px;height:474px;background:url('/image/site/img_cont_bg.png')no-repeat center;background-size:cover}
.sec3 .cont .img_cont .img{width:310px;height:440px;}
.sec3 .cont .img_cont a{border-radius:20px;display:inline-block;margin-top:20px;padding:10px 15px;border:1px solid #c2c2c2;background:#fff;text-align:center;font-size:14px;color:#333;}
.sec3 .cont .img_cont a:hover{background:#333;color:#fff}
.sec3 .cont .txt_cont{float:left;padding-top:20px;width: 673px;}
.sec3 .cont .txt_cont .p1{font-size:20px;font-weight:bold;color:#21201E}
.sec3 .cont .txt_cont .p2{font-size:16px;color:#646464;line-height:28px;margin-top:10px;margin-bottom:25px;white-space: pre-wrap;}
.sec3 .cont:after{display:block;content:"";clear:both}


.sec4{position:relative;background:#242220 url('/image/site/sec4_bg.png')no-repeat;background-position: bottom center;background-size:contain;padding:150px 0;overflow:hidden}
.sec4 .logo_container{margin-top:30px}
.sec4 .logo_container li{width:212px;height:212px;float:left;margin-right:4px;margin-bottom:4px;}
.sec4 .logo_container li img{transition: all .2s ease-in-out;}
.sec4 .logo_container li:hover img{ transform: scale(1.04); }
.sec4 .logo_container li:nth-child(5n){margin-right:0}
.sec4 .content_lst li:nth-child(1){color:#bbb !important}
.sec4 .content_lst li:nth-child(2){margin-top:-13px;color:#fff !important;line-height:38px;white-space:pre-wrap;}


.sec5{position:relative;background:#fff url('/image/site/sec5_bg.png')no-repeat;background-position: bottom center;background-size:contain;padding:150px 0 240px 0;overflow:hidden}
.sec5 .p1{font-size:32px;font-weight:bold;color:#ABA7A2;line-height:38px;margin-top:100px}
.sec5 .bx{display:block;margin-top:40px}
.sec5 .bx .slide{position:relative;}
.sec5 .bx .slide p{position:absolute;top:397px;left:20px;display:inline-block;font-size:18px;font-weight:bold;padding:10px 20px;background:#F7941D;color:#191818}
.sec5 .bx .slick-prev{position:absolute;bottom:-60px;right:105px;width:60px;height:60px;background:url('/image/site/prev_btn.png')no-repeat center;background-size:cover;z-index:900;overflow:hidden;text-indent:-9999px;border:none;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.sec5 .bx .slick-prev:hover{background:url('/image/site/prev_btn_act.png')no-repeat center}
.sec5 .bx .slick-next{position:absolute;bottom:-60px;right:35px;width:60px;height:60px;background:url('/image/site/next_btn.png')no-repeat center;background-size:cover;z-index:900;overflow:hidden;text-indent:-9999px;border:none;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.sec5 .bx .slick-next:hover{background:url('/image/site/next_btn_act.png')no-repeat center}
.sec5 .m_bx{display:none}

.sec6{position:relative;background:#F7941D;overflow:hidden}
.sec6 .content{width:50%;height:620px;float:left;position:relative;}
.sec6 .content .address_box{position:absolute;top:140px;right:50px}
.sec6 .content .address_box .p1{font-size:28px;color:#fff;line-height:34px;margin-top:30px}
.sec6 .content .address_box .p2{font-size:18px;color:#FFE0BA;line-height:30px;}
.sec6 .content .address_box .p2 span{color:#fff}
.sec6 .map{width:50%;float:left;position:relative;}
.sec6 .map iframe{width:100%;height:620px;margin-bottom:-10px}


@media all and (max-width:1100px) {
    .relative{width:auto}
    .relative .box{border-left:none;margin-top:30px}
    .relative .box .left_text{display:none}
    .t1{font-size:30px;}

    .content_lst{margin-bottom:50px}
    .content_lst li{float:none}
    .content_lst li:nth-child(1){margin-top:0;padding-left:0px;width:auto;font-size:20px;line-height:27px;margin-bottom:20px}
    .content_lst li:nth-child(2){width:auto}
    .content_lst li>div{float:none;width:auto;padding:10px 0;margin-bottom:50px}
    .content_lst li>div:nth-child(2){margin-left:0}
    .content_lst li>div p{font-size:20px;height:auto;line-height:28px;margin-bottom:10px}
    .content_lst li>div table td{font-size:14px;line-height:25px;}

    .content_lst li>p{font-size:14px;width:auto;margin-top:20px}
    .content_lst li>p.shape{position:relative;top:0;right:0;margin-top:0 !important}

    .sec1{padding:50px 10px;padding-top:100px}
    .sec1 .relative{margin-top:0px}
    .sec1 .p1{width:90%}
    .sec1 .p2{font-size:20px;line-height:28px;margin-top:20px}
    .sec1 .p3{font-size:16px;line-height:26px;margin-top:0}
    .sec1 .p3 span{vertical-align:-2px}
    .sec1 .p4{margin-top:0}

    .sec1 ul{margin-top:50px}
    .sec1 ul li{position:relative;width:100%;float:none;font-size:16px;text-align:left;margin-bottom:20px}
    .sec1 ul li span{display:block;font-size:30px;line-height:30px}
    .sec1 ul li:nth-child(1),.sec1 ul li:nth-child(2),.sec1 ul li:nth-child(3){background:none}

    .sec1 .story_image{position:relative;top:0px;right:0;z-index:1;margin-top:50px;width:auto}
    .sec1 .story_image img{width:90%;display:block;margin:0 auto}
    .sec1 .story_image .img2{position:absolute;top:-20px;left:0}

    .sec1 .story_image_wrap{position:relative;top:0px;right:0;z-index:1;margin-top:50px;width:auto;}
    .sec1 .story_image_twinkle{width:auto;background-size:70%;}
    .sec1 .view_twinkle{display:none !important}

    @keyframes slidein
    {
        from{left:10px;top:0px;}
        to{left:0;top:-20px;}
    }

    .sec1 canvas{display:none}
    .sec1 .circle_box{display:none !important;}

    .sec1 .sec1_world{margin-bottom:-150px;margin-top:50px;width:100%}

    .sec2{padding:50px 10px 0 10px}
    .sec2 .effect{width:90%;position:absolute;right:0;bottom:0;z-index:-1}

    .sec3{padding:50px 10px}
    .sec3 .effect{display:none}
    .sec3 .cont{padding-left:0}
    .sec3 .cont:last-child{margin-top:50px}
    .sec3 .cont .img_cont{float:none;width:300px;height:auto;background:none}
    .sec3 .cont .img_cont .img{width:100%;height:400px;}
    .sec3 .cont .txt_cont{float:none;padding-top:20px;width: auto;}
    .sec3 .cont .txt_cont .p1{font-size:17px}
    .sec3 .cont .txt_cont .p2{font-size:14px;margin-bottom:20px;white-space: pre-wrap;}

    .sec4{padding:50px 10px;}
    .sec4 .logo_container{margin-top:20px;width:300px;margin:0 auto}
    .sec4 .logo_container li{width:96px;height:96px}
    .sec4 .logo_container li img{width:100%}
    .sec4 .logo_container li:hover img{ transform: scale(1); }
    .sec4 .logo_container li:nth-child(5n){margin-right:4px}
    .sec4 .content_lst li:nth-child(2){margin-top:0px;line-height:28px}

    .sec5{padding:50px 10px 100px 10px}
    .sec5 .p1{font-size:22px;line-height:30px;margin-top:30px}
    .sec5 .bx{display:none}
    .sec5 .m_bx{display:block;margin-top:20px}
    .sec5 .m_bx .slide{position:relative;}
    .sec5 .m_bx .slide img{height:auto;width:100%}
    .sec5 .m_bx .slide p{position:absolute;top:397px;left:10px;display:inline-block;font-size:14px;font-weight:bold;padding:5px 10px;background:#F7941D;color:#191818}
    .sec5 .m_bx .slick-prev{position:absolute;bottom:-60px;right:60px;width:50px;height:50px;background:url('/image/site/prev_btn_act.png')no-repeat center;background-size:cover;z-index:900;overflow:hidden;text-indent:-9999px;border:none;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
    .sec5 .m_bx .slick-next{position:absolute;bottom:-60px;right:0px;width:50px;height:50px;background:url('/image/site/next_btn_act.png')no-repeat center;background-size:cover;z-index:900;overflow:hidden;text-indent:-9999px;border:none;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}

    .sec6 .content{width:100%;height:auto;padding:50px 10px;float:none;position:relative;}
    .sec6 .content .address_box{position:relative;top:0;right:0;padding:0 10px}
    .sec6 .content .address_box .p1{font-size:20px;line-height:34px;margin-top:30px}
    .sec6 .content .address_box .p2{font-size:16px;line-height:26px;}
    .sec6 .map{width:100%;float:none;}
    .sec6 .map iframe{width:100%;height:300px}
}
