@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
:root {
    --primary: #B3946D;
}
.wrapper {max-width:1430px}
.title_box {margin-bottom:60px}
.title_box .tit {text-transform:uppercase;}
.title_box p {color:#565656}

.sec_hero .txt_wrap .logo {max-width:520px}
.sec_hero .txt_wrap .tit .color {color:#EDC594}
.sec_hero .view_more .round {background:var(--primary)}

.sec_info {background:var(--primary)}
.sec_info .cont {color:#f3f3f3}

.sec_03 {display:flex}
.sec_03 > div {width:50%}
.sec_03 .right {display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:20px 100px}
.sec_03 .list {display:flex;align-items:flex-start;justify-content:space-between;margin-top:120px;text-align:center;width:100%;max-width:760px}
.sec_03 .list div span {display:block;font-size:22px;font-weight:600;margin-top:32px}

.sec_04 {background:#1B1817;padding:var(--sec-padding) 0;color:#ffffff}
.sec_04 .color .list {display:flex;}
.sec_04 .color .list > div {width:100%;height:150px;display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;font-size:24px;font-weight:600;color:#ffffff;}
.sec_04 .color .list .item_01 {background:#533B1F}
.sec_04 .color .list .item_02 {background:#504A44}
.sec_04 .color .list .item_03 {background:#1B1817}
.sec_04 .color .list .item_04 {background:linear-gradient(#FEDB4E, #E05C06)}
.sec_04 .color .list .item_05 {background:linear-gradient(#FF9450, #FF6300)}
.sec_04 .font {padding-top:calc(var(--sec-padding) * 1.5)}
.sec_04 .font .list {display:flex;text-align:center}
.sec_04 .font .list > div {width:100%;position:relative}
.sec_04 .font .list > div::before {content:'';display:block;width:317px;height:228px;background:#533B1F;border-radius:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);filter:blur(80px);opacity:.5}
.sec_04 .font .list > div strong {display:block;font-size:120px;font-weight:500;position:relative;z-index:1}
.sec_04 .font .list > div span {display:block;font-size:24px;font-weight:500;position:relative;z-index:1}
.sec_04 .font .eng {font-family: "Inter", sans-serif;}

.sec_05 {padding:var(--sec-padding) 0}
.sec_05 .list {display:flex;gap:40px}
.sec_05 .list .item {width:100%;border:solid 1px #C4C4C4;border-radius:10px;padding:60px 20px;text-align:center}
.sec_05 .list .item .tit {display:block;font-size:24px;font-weight:700;margin-top:24px}
.sec_05 .list .item p {font-size:18px;font-weight:500;margin-top:15px}

.sec_07 .item {color:#ffffff;padding:var(--sec-padding) 0}
.sec_07 .item_01 {background:#533B1F}
.sec_07 .item_02 {background:#504A44}
.sec_07 .item_03 {background:#1B1817}
.sec_07 .title_box p {color:#ffffff}
.sec_07 .app_list {display:flex;align-items:flex-start;justify-content:space-between;gap:20px;}
.sec_07 .app_list > div {width:100%;max-width:375px;border-radius:20px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.15)}

.sec_08 {position:relative}
.sec_08 .img_wrap {display:flex;}
.sec_08 .img_wrap > div {width:100%}
.sec_08 .logo {width:100%;max-width:560px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);padding:0 20px}
.sec_08 .logo img {width:100%}



@media (hover: hover) {}

@media all and (max-width: 1599px) {
    .sec_03 .list {margin-top:40px}
    .sec_03 .list div img {display:inline-block;width:100px}
}
@media all and (max-width: 1199px) {
    .title_box {margin-bottom:42px}
    .sec_03 .list {margin:0}
    .sec_03 .right {padding:24px 40px}
    .sec_03 .list div img {width:80px}
    .sec_03 .list div span {font-size:16px;margin-top:14px}
    .sec_04 .color .list > div {height:125px;font-size:20px}
    .sec_05 .list {gap:20px}
    .sec_04 .font .list > div {padding:60px 0}
    .sec_04 .font .list > div strong {font-size:50px}
    .sec_04 .font .list > div span {font-size:20px}
    .sec_05 .list .item p {font-size:16px}
    .sec_07 .app_list > div {border-radius:10px}
}

@media all and (max-width: 1023px) {
    .sec_03 {display:block}
    .sec_03 > div {width:100%}
}

@media all and (max-width: 767px) {
    .title_box {margin-bottom:24px}
    .sec_03 .list div span {font-size:12px;margin-top:14px}
    .sec_03 .list div img {width:60px}
    .sec_04 .color .list {flex-wrap:wrap}
    .sec_04 .color .list > div {width:calc(100% / 3);height:100px;font-size:14px}
    .sec_04 .color .list > div:nth-child(n + 4) {width:50%}
    .sec_04 .font {padding-top:var(--sec-padding)}
    .sec_04 .font .list > div strong {font-size:18px}
    .sec_04 .font .list > div span {font-size:14px}
    .sec_05 .list {flex-direction:column;}
    .sec_05 .list .item {padding:45px 20px}
    .sec_05 .list .item img {width:60px}
    .sec_05 .list .item .tit {font-size:18px;margin-top:18px}
    .sec_05 .list .item p {font-size:14px}
    .sec_07 .app_list {gap:10px}
    .sec_07 .app_list > div {border-radius:5px}
    .sec_08 .img_wrap {display:block;}
    .sec_08 .logo {max-width:240px}
    
}
