/***************** sec01 *****************/
#sec01{width:100%;height:100vh;padding:0;position: relative;background:#050505;}
#sec01 .sec_con{}

#mouse-scroll {position:absolute;margin: auto;left: 50%;bottom:40px;-webkit-transform: translateX(-50%);z-index:88;}
#mouse-scroll span{display: block;width: 5px;height: 5px;-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);transform: rotate(45deg);border-right: 2px solid #fff;border-bottom: 2px solid #fff;margin: 0 0 3px 5px;}
#mouse-scroll .down-arrow-1, #mouse-scroll .down-arrow-2, #mouse-scroll .down-arrow-3 {-webkit-animation: mouse-scroll 1s infinite;-moz-animation: mouse-scroll 1s infinite;}
#mouse-croll .down-arrow-1 {-webkit-animation-delay: .1s;-moz-animation-delay: .1s;-webkit-animation-direction: alternate;}
#mouse-scroll .down-arrow-2 {-webkit-animation-delay: .2s;-moz-animation-delay: .2s;-webkit-animation-direction: alternate;}
#mouse-scroll .down-arrow-3 {-webkit-animation-delay: .3s;-moz-animation-dekay: .3s;-webkit-animation-direction: alternate;}
@keyframes mouse-scroll { 0% {opacity: 0;} 50% {opacity: 0.5;} 100% {opacity: 1;} }
@-webkit-keyframes mouse-scroll { 0% {opacity: 1;} 50% {opacity: .5;} 100% {opacity: 1;} }

.sec01_bg {width: 100%;height: 100%;position: absolute;overflow: hidden;opacity:0.07;top: 0;left: 0;mix-blend-mode: luminosity;}
.sec01_bg iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;transform: scale(1.5);filter: hue-rotate(344deg);}

.sec01_txt {position:relative;width: 100%;height:100vh;display:flex;align-items:center;justify-content:center;}
.typewriter,.typewriter1,.typewriter2 {white-space: nowrap;overflow: hidden;margin:0 auto;line-height:1;}
.typewriter {top: 4rem;font-size:130px;color:#fff;border-right:0px solid transparent;font-weight:800;display: flex;animation: animated-text__0 1.5s steps(30, end) 1s normal both, animated-cursor__0 600ms steps(30, end) forwards;}
.typewriter1{top: 16rem;font-size:130px;color:#fff;font-weight: 800;display: flex;border-right:6px solid transparent;animation: animated-text__1 1.5s steps(30, end) 1s 1 normal both, animated-cursor__1 900ms steps(30, end) infinite;-webkit-animation-delay:2s;animation-delay:2s;}
.typewriter2 {font-size:24px;color: #fff;border-right:4px solid transparent;margin-top:40px;animation: animated-text__2 2s steps(30, end) 1s 1 normal both, animated-cursor__2 900ms steps(30, end) infinite;-webkit-animation-delay:3s;animation-delay:3s;}
@keyframes animated-cursor__0 {0% {border-right-color: black;} 99% {border-right-color: rgba(255, 255, 255, 0.8);} 100%{border-right-color:transparent;} }
@keyframes animated-cursor__1 { from {border-right-color: black;} to {border-right-color: rgba(255, 255, 255, 0.8);} }
@keyframes animated-cursor__2 { from {border-right-color: black;} to {border-right-color: rgba(255, 255, 255, 0.8);} }
@keyframes animated-text__0 { 0% {width: 0;}50%{border-right: 6px solid #fff;} 100% {width:69rem;} }
@keyframes animated-text__1 {0%{width: 0;}50%{border-right: 6px solid #fff;} 100%{width:72rem;} }
@keyframes animated-text__2 { 0% {width: 0;} 50%{border-right:4px solid black;} 100% {width:42rem;} }

@media(max-width:850px){
    .typewriter{font-size:110px;}
    .typewriter1{font-size:110px;}
    @keyframes animated-text__0 { from {width: 0;} to {width:58rem;} }
    @keyframes animated-text__1 { from {width: 0;} to {width:61rem;} }
}

@media(max-width:650px){
    .typewriter{font-size:60px;}
    .typewriter1{font-size:60px;}
    .typewriter2{}
    @keyframes animated-text__0 { from {width: 0;} to {width:32rem;} }
    @keyframes animated-text__1 { from {width: 0;} to {width:34rem;} }
}
@media(max-width:450px){
    .typewriter{font-size:48px;}
    .typewriter1{font-size:48px;}
    .typewriter2{font-size:18px;}
    @keyframes animated-text__0 { from {width: 0;} to {width:26rem;} }
    @keyframes animated-text__1 { from {width: 0;} to {width:27rem;} }
    @keyframes animated-text__2 { from {width: 0;} to {width:32rem;} }
}

@media(max-width:1170px){  .sec01_bg iframe{transform: scale(2.0);}  }  @media(max-width:850px){  .sec01_bg iframe{transform: scale(3);}  }  @media(max-width:550px){  .sec01_bg iframe{transform: scale(4);}  }  @media(max-width:390px){  .sec01_bg iframe{transform: scale(5);}  }




/***************** sec02 *****************/
#sec02{background:#000;position: relative;padding:300px 0;}
#sec02 .sec_con{max-width: 1780px;}
.sec02_pt_wrap{display:flex;}
.sec02_pt{width:50%;position:relative;}
.sec02_pt.pt_lf {height:400px;}
.sec02_pt.pt_rt{display:flex;align-items:center;}

#sec02 .sec_title {width: 100%;max-width: 100%;z-index: 1;margin-bottom:0;font-size:56px;text-align:left;font-weight:300; color:#fff;line-height:1.2;transition-duration: 0.4s;word-break:keep-all;}
#sec02 .sec_title h1{color:#fff;}
#sec02 .sec_title p{width:100%;max-width:900px;margin:30px auto 0;text-align:left;color:#ccc;font-size:20px;line-height:1.4;}

.sec02_bg {width:90%;position: absolute;top:50%;left: 50%;transform: translate(-50%,-50%);z-index: -1;opacity:0.65;display: flex;align-items: center;justify-content: center;}
.sec02_bg svg {width: 100%;transform: scale(1.1);}

.fade_txt{font-weight:800 !important;}
.fadeIn {-webkit-animation-name: fadeIn;animation-name: fadeIn;-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
@keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} }
@-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} }



/***************** sec03 *****************/

.sec03_pt_wrap{display:flex;margin:0 -10px;padding-top: 60px;}
.sec03_pt {width: 25%;padding: 0 10px;text-align:center;}
.sec03_icon {width: 60px;height: 60px;display: flex;align-items: center;justify-content: center;margin: 0 auto;position: relative;}

.sec03_pt h4{font-size:26px;font-weight:900;color:#000;margin:30px auto 15px;}
.sec03_pt p{font-size:18px;font-weight:400;color:#999;margin: 0 auto;width:75%;}

.sec03_pt.pt01 .sec03_icon{padding:5px 0;}
.sec03_pt.pt01 .path_wrap {width: 100%;height: 100%;position: relative;}
.sec03_pt.pt01 .path{width:100%;height:6px;background:#000;position: absolute;left:0;}
.sec03_pt.pt01 .path1{top:0;}
.sec03_pt.pt01 .path1:after {content: '';position: absolute;-webkit-animation: sec03-ani01 3s cubic-bezier(0, 0, 0.03, 0.9) infinite;animation: sec03-ani01 3s cubic-bezier(0, 0, 0.03, 0.9) infinite;height:6px;background:#de1e25;width: 100%;left: 0;}
.sec03_pt.pt01 .path2{top:25%;}
.sec03_pt.pt01 .path2:after{content: '';position: absolute;-webkit-animation: sec03-ani01 3s cubic-bezier(0, 0, 0.03, 0.9) infinite;animation: sec03-ani01 3s cubic-bezier(0, 0, 0.03, 0.9) infinite;height:6px;background:#de1e25;width: 100%;left: 0;}
.sec03_pt.pt01 .path3{top:50%;}
.sec03_pt.pt01 .path4{top:75%;}
@keyframes sec03-ani01 { 0%, 44%, 88.1%, 100% {transform-origin: left;} 0%, 100%, 88% {transform: scaleX(0);} 44.1%, 88% {transform-origin: right;} 33%, 44% {transform: scaleX(1);} }

.sec03-ani02 {position: absolute;height:48px;width:48px;border: solid 6px #000;display: inline-block;}
.sec03_pt.pt02 .sec03_icon:before {content:'';width: 6px;height:100%;background:#de1e25;position: absolute;top:50%;left: 50%;transform: translate(-50%,-50%);z-index:1;animation: sec03-ani02 1.5s infinite alternate;}
.sec03_pt.pt02 .sec03_icon:after {content:'';width:100%;height: 6px;background:#de1e25;position: absolute;top:50%;left:50%;transform: translate(-50%,-50%);z-index:1;animation: sec03-ani03 1.5s infinite alternate;}

@keyframes sec03-ani02 { 100% {height:60%;} }@-webkit-keyframes sec03-ani02 {100% {height:60%;}}
@keyframes sec03-ani03 { 100% {width:60%;} }@-webkit-keyframes sec03-ani02 {100% {width:60%;}}

.sec03_pt.pt03 .path{position: absolute;width:27.12px;height:27.12px;border:6px solid #000;}
.sec03_pt.pt03 .path1{top:0;left:0;border:6px solid #de1e25;}
.sec03_pt.pt03 .path2{top:0;right:0; animation: sec03-ani03-01 3.6s infinite;}
.sec03_pt.pt03 .path3{bottom:0;left:0;animation: sec03-ani03-02 3.6s infinite;}
.sec03_pt.pt03 .path4{bottom:0;right:0;border:6px solid #de1e25;animation: sec03-ani03-03 3.6s infinite;}

@keyframes sec03-ani03-01 {
    0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    25% {-webkit-transform: translate(0,33px);transform: translate(0,33px)}
    50% {-webkit-transform: translate(0,0);transform: translate(0,0)}
}
@keyframes sec03-ani03-02 {
    50% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    75% {-webkit-transform: translate(33px,0);transform: translate(33px,0)}
    100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
}
@-webkit-keyframes sec03-ani03-03 {
    0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    25% {-webkit-transform: translate(0,-33px);transform: translate(0,-33px) }
    50% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    75% {-webkit-transform: translate(-33px,0);transform: translate(-33px,0)}
    100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
}

.sec03_pt.pt04 .sec03_icon {}
.sec03_pt.pt04 .sec03_icon:before {content: '';width: 26px;height: 40px;position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);background-image: url('../img/main/sec03-04-01.png');background-repeat: no-repeat;background-position: center;background-size: contain;animation: sec03-ani04-01 3s infinite;}
.sec03_pt.pt04 .sec03_icon:after {content: '';width: 26px;height: 40px;position: absolute;left: 50%;top: 0;transform: translateX(-50%);background-image: url('../img/main/sec03-04-02.png');background-repeat: no-repeat;background-position: center;background-size: contain;animation: sec03-ani04-02 3s infinite;}
@keyframes sec03-ani04-01 {
    0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    50% {-webkit-transform: translate(-10px,0);transform: translate(-10px,0)}
    100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
}
@keyframes sec03-ani04-02 {
    0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    50% {-webkit-transform: translate(10px,0);transform: translate(10x,0)}
    100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
}


/***************** sec04 *****************/
#sec04{background:#050505;position: relative;}
#sec04:after{content: '';background: url("../img/main/sec04-00.png");position: absolute;top:0;left:-5%;width:1322px;height:1597px;}

.sec04_pt_wrap{display:flex;margin:0 -30px;}
.sec04_pt{width:50%;padding:0 30px;}
.sec04_pt.pt_rt{padding-top:60px;}

.sec04_box {background:transparent;}
.sec04_box .sec04_con{width:100%;min-height: 520px;background: #fff;margin-bottom:50px;padding: 60px 50px;display: flex;flex-flow: column;justify-content: space-between;transition:1s;}
.sec04_box h2{font-size:40px;color:#101010;font-weight:800;margin-top:15px;transition:all 0.3s;}
.sec04_box p{font-size:20px;color:#999;font-weight:400;position: relative;padding-left:10px;transition:all 0.3s;}
.sec04_box p:before{content: '';position: absolute;top:11px;left:0;width:4px;height:4px;background:#999;transition:all 0.3s;}
.sec04_box .sec04_icon img{transition:all 0.3s;}
.sec04_box.active .sec04_con{background: #de1e25;transition:1s;}
.sec04_box.active h2{color:#fff;}
.sec04_box.active p{color:#fff;}
.sec04_box.active p:before{background:#fff;}
.sec04_box.active .sec04_icon img{mix-blend-mode: color-dodge;filter: invert(1);}


/***************** sec05 *****************/
.sec05_pt_wrap{}
.sec05_pt_wrap ul li:first-child .sec05_link{border-top:1px solid #efefef;}

.sec05_link {display:flex;align-items:center;padding:50px 0;border-bottom:1px solid #efefef;width: 100%;transition-property: all;transition-duration: .3s;transition-timing-function: ease-out;font-size: 1.4rem;line-height: 1.5;margin-top: 0.6rem;margin-bottom: 0.4rem;background-image: linear-gradient(transparent calc(100% - 0.25rem), rgba(222, 30, 37, 1) 0.25rem);background-position: 0 100%;background-size: 0 5px;background-repeat: no-repeat;}
.sec05_link .date{width:12%;color:#101010;font-weight:800;font-size:20px;transition-property: all;transition-duration: .3s;transition-timing-function: ease-out;}
.sec05_link p{width:80%;padding:0 10px;color:#101010;font-weight:800;font-size:20px;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-property: all;transition-duration: .3s;transition-timing-function: ease-out;}
.sec05_link .ico{width:8%;text-align: right;opacity:0.6;color:#050505;font-size:20px;transition-property: all;transition-duration: .3s;transition-timing-function: ease-out;}

.sec05_link:hover {background-size: 100% 5px;}
.sec05_link:hover .date{color:#de1e25;}
.sec05_link:hover p{color:#de1e25;}
.sec05_link:hover .ico{color:#de1e25;}

#sec05 .sec_title{margin-bottom:0;}
.news_btn {margin-top:60px;font-size:90px;font-weight:800;color: #000;display:flex;align-items:center;margin-left:-20px;position: relative;transition:0.2s;}
.news_btn .ico{color:#000;transition:0.2s;}
.news_btn:hover .ico{color:#de1e25;transform: rotate(45deg);}


/***************** media *****************/
@media(max-width:1410px){
    #sec02 .sec_title{font-size:40px;}
}

@media(max-width:1010px){
    .sec03_pt_wrap{flex-flow:row wrap;padding-top:20px;}
    .sec03_pt{width:50%;margin-bottom: 40px;}
}
@media(max-width:850px){
    #sec02{ padding: 100px 0;}
    .sec02_pt_wrap{flex-flow: column;}
    .sec02_pt{width:100%;}
    #sec02 .sec_title{text-align:center;}
    #sec02 .sec_title p{text-align:center;}
    .sec02_pt.pt_lf {order: 1;display: flex;}

    .sec04_pt_wrap{margin:0 auto;flex-flow: column;}
    .sec04_pt.pt_rt{padding-top:0;}
    .sec04_pt{width:100%;padding:0;}
    .sec04_box .sec04_con{min-height:420px;margin-bottom:20px;padding:40px;}

    .sec05_link .date{font-size:18px;}
    .sec05_link p{font-size:18px;}
}
@media(max-width:650px){
    .sec03_pt p{width:100%;}


    .sec04_box .sec04_con {padding:30px;min-height: 330px;}
    .sec04_box p{font-size:16px;}
    .sec04_box p:before{top:9px;}

    .sec05_link{flex-flow: column;align-items:flex-start;padding:30px 0;}
    .sec05_link p{width:100%;padding:0;}
    .sec05_link .ico{display:none;}
    .sec05_link p{font-size:16px;}
    .sec05_link .date{display: flex;order: 1;margin-top: 10px;font-size:14px;}
}
@media(max-width:450px){
    #sec02 .sec_title{font-size:30px;}
    #sec02 .sec_title p{font-size:14px;}
    .sec02_pt.pt_lf {height:300px;}

    .sec03_pt h4{width:60%;font-size:18px;margin: 20px auto 12px;}
    .sec03_pt p{font-size:14px;}
    .sec03_icon{width:40px;height:40px;}
    .sec03_pt.pt01 .sec03_icon{padding: 8px 0 4px;}
    .sec03_pt.pt01 .path{height:4px;}
    .sec03_pt.pt01 .path1:after,.sec03_pt.pt01 .path2:after{height:4px;}
    .sec03_pt.pt02 .sec03_icon:before{width:4px;}
    .sec03_pt.pt02 .sec03_icon:after{height:4px;}
    .sec03-ani02{width:30px;height:30px;border: solid 4px #000;}
    .sec03_pt.pt03 .path{width: 19.12px;height: 19.12px;border:4px solid #000;}
    .sec03_pt.pt03 .path1{border:4px solid #de1e25;}
    .sec03_pt.pt03 .path4{border:4px solid #de1e25;}
    @keyframes sec03-ani03-01 {
        0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
        25% {-webkit-transform: translate(0,21px);transform: translate(0,21px)}
        50% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    }
    @keyframes sec03-ani03-02 {
        50% {-webkit-transform: translate(0,0);transform: translate(0,0)}
        75% {-webkit-transform: translate(21px,0);transform: translate(21px,0)}
        100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    }
    @-webkit-keyframes sec03-ani03-03 {
        0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
        25% {-webkit-transform: translate(0,-21px);transform: translate(0,-21px) }
        50% {-webkit-transform: translate(0,0);transform: translate(0,0)}
        75% {-webkit-transform: translate(-21px,0);transform: translate(-21px,0)}
        100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
    }
    .sec03_pt.pt04 .sec03_icon:before{width: 20px;height: 24px;}
    .sec03_pt.pt04 .sec03_icon:after{width: 20px;height: 24px;}

    .sec04_box .sec04_con{}
    .sec04_box h2{font-size:30px;}
}