@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap');

:root {
    --primary: #F52E15;
}
.wrapper {max-width:1420px}
.title_box {margin-bottom:60px}
.title_box p {color:#565656}

.sec_hero .txt_wrap .logo {max-width:320px}
.sec_hero .txt_wrap .tit .color {color:#FFEDDD}
.sec_hero .view_more .round {background:var(--primary)}

.sec_info {background:var(--primary)}
.sec_info .cont {color:#ffffff}

.sec_03 {padding:var(--sec-padding) 0;background:url('img/index_04_bg.svg') repeat-x left bottom}
.sec_03 .over_view {margin-top:120px}

.sec_04 .txt_slide {opacity:1;margin:50px 0}
.sec_04 .txt_slide p {font-family: "Montserrat", sans-serif;font-weight:800;color:#FB825D}

.sec_05 {height:946px;background:url('img/sec_05_01.jpg') no-repeat center/cover;position:relative}
.sec_05 .title_box {width:calc(100% - 40px);max-width:840px;background:#121212;border-radius:40px 0 40px 0;box-shadow:0 4px 30px rgba(0,0,0,.25);color:#ffffff;padding:60px 70px;position:absolute;top:50%;left:50%;transform:translateY(-50%);z-index:3;margin:0}
.sec_05 .title_box .cap {width:290px;position:absolute;bottom:74%;right:-4%}
.sec_05 .title_box .tit {margin-top:45px}
.sec_05 .title_box p {color:#ffffff}

.sec_06 {padding:var(--sec-padding) 0;background:url('img/sec_06_bg.jpg') no-repeat center/cover}
.sec_06 .list {display:flex;gap:40px}
.sec_06 .list > div {width:100%}
.sec_06 .list > div img {width:100%}

.sec_08 {position:relative}
.sec_08 .img {width:100%;padding:0 20px;position:absolute;top:50%;left:0;transform:translateY(-50%);z-index:10;text-align:center}
.sec_08 .img img {width:35%;max-width:370px}

.sec_09 {padding:var(--sec-padding) 0;background:linear-gradient(#FFEDDE, #ffffff);position:relative}
.sec_09 .img_wrap {width:120%;max-width:initial;margin-left:-10%;position:relative;z-index:5}
.sec_09 .swiper {width:120vw;transform-origin:center;position:absolute;bottom:60%;left:-10vw;z-index:1}
.sec_09 .swiper-wrapper {-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important}
.sec_09 .swiper.white {background:var(--white);transform:rotate(9deg)}
.sec_09 .swiper.black {background:var(--black);transform:rotate(-9deg)}
.sec_09 .swiper-wrapper {-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important}
.sec_09 .swiper-slide {width:auto;margin-right:70px;font-size:50px;font-weight:700;color:var(--primary);padding:10px}



@media (hover: hover) {}

@media all and (max-width: 1729px) {
    .sec_05 .title_box {left:auto;right:40px}
}
@media all and (max-width: 1199px) {
    .title_box {margin-bottom:42px}

    .sec_03 .over_view {margin-top:80px}
    .sec_09 .swiper {display:none}

    .sec_05 {height:700px}
    .sec_05 .title_box {max-width:calc(100% - 80px);padding:40px 30px}
    .sec_05 .title_box .logo {width:143px}
    .sec_05 .title_box .cap {width:240px;bottom:81%;right:-3%}

    .sec_06 .list {gap:20px}
}

@media all and (max-width: 1023px) {
    .sec_06 .list {flex-direction:column;max-width:400px;margin:0 auto;}
}

@media all and (max-width: 767px) {
    .title_box {margin-bottom:24px}
    
    .sec_03 .over_view {margin-top:48px}
    
    .sec_05 {height:705px}
    .sec_05 .title_box {padding:34px 20px;right:20px;max-width:calc(100% - 40px);bottom:80px;top:auto;transform:none}
    .sec_05 .title_box .logo {width:113px}
    .sec_05 .title_box .cap {width:145px;bottom:88%}
    .sec_05 .title_box .tit {margin-top:20px}

}
