@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@300..900&display=swap');

:root {
    --primary: #3DA7FF;
}
.wrapper {max-width:1440px;}
.title_box {margin-bottom:60px}
.title_box .tit {font-family: "Red Hat Display", sans-serif;}
.title_box p {color:#565656}

.line_txt {-webkit-text-stroke: 1px #222222;color: transparent !important;}
.txt_slide {opacity:1;padding:100px 0;margin:0}
.txt_slide p {font-size:160px;animation-duration:18s;font-family: "Red Hat Display", sans-serif}

.sec_hero .txt_wrap .logo {max-width:785px}
.sec_hero .txt_wrap .tit .color {color:var(--primary)}
.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}
.sec_03 .over_view {margin-top:120px}

.page_view {padding-bottom:calc(var(--sec-padding)/2)}
.page_view .list > div {box-shadow:none}
.page_view .list > div img {display:block;box-shadow:0 4px 20px rgba(0,0,0,0.15)}
.page_view .list img + img {margin-top:50px}

.sec_04 {background:url('img/sec_04_bg.jpg') no-repeat center/cover;color:#ffffff;padding:var(--sec-padding) 0}
.sec_04 .title_box p {color:rgba(255,255,255,.6)}
.sec_04 .list {display:flex;align-items:center;justify-content:center;gap:40px;}
.sec_04 .list .item {width:440px;height:440px;background:linear-gradient(125deg, rgba(84,79,79,.4), rgba(84,79,79,.1));border:solid 1px rgba(255,255,255,.35);border-radius:400px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;backdrop-filter:blur(16px);}
.sec_04 .list .item .tit {display:block;width:100%;font-size:40px;font-weight:700;color:var(--primary);font-family: "Red Hat Display", sans-serif}
.sec_04 .list .item p {font-size:24px}

.sec_05 {background:#EFEFEF;padding:var(--sec-padding) 0}
.sec_05 .font .item {text-align:center;padding:35px 20px;background:#ffffff;font-size:20px}
.sec_05 .font p {font-size:24px;margin-top:10px}
.sec_05 .font p strong {font-size:1.4em;margin-right:10px}
.sec_05 .font .eng {background:#222222;color:#ffffff;margin-top:24px}
.sec_05 .font .eng p {font-family: "Red Hat Display", sans-serif}
.sec_05 .color {display:flex;gap:24px;margin-top:24px}
.sec_05 .color > div {display:flex;align-items:center;justify-content:center;width:100%;height:300px;font-size:24px;color:#ffffff;background:#3DA7FF}
.sec_05 .color .item_02 {background:#001024}
.sec_05 .color .item_03 {background:#276BEA}

.sec_07 {background:#000000}
.sec_08 {background:#000000;color:#ffffff;padding-bottom:0}
.sec_08 .title_box p {color:rgba(255,255,255,.6)}
.sub_page_view .list > div {overflow:hidden;max-width:375px}
.sub_page_view .list {justify-content:space-between;}
.sub_page_view .list > div img {width:calc(100% + 2px);max-width:initial}

.sec_09 {background:#000000;color:#ffffff}
.sec_09 .line_txt {-webkit-text-stroke: 1px #ffffff}

.sec_10 {background:url('img/sec_10_bg.jpg') no-repeat center/cover;color:#ffffff;padding:470px 0}
.sec_10 .title_box {margin:0}
.sec_10 .title_box .sub {font-size:34px;font-weight:500;color:#ffffff}
.sec_10 .title_box .tit {font-size:80px}
.sec_10 .line_txt {-webkit-text-stroke: 1px #ffffff}


@media all and (max-width: 1429px) {
    .sec_04 .list .item {width:360px;height:360px}
}

@media all and (max-width: 1199px) {
    .title_box {margin-bottom:42px}
    .txt_slide p {font-size:120px}

    .sec_03 .over_view {margin-top:80px}

    .sec_04 .list {gap:20px}
    .sec_04 .list .item {width:320px;height:320px}
    .sec_04 .list .item .tit {font-size:28px}
    .sec_04 .list .item p {font-size:18px;}

    .sec_05 .font .item {font-size:16px}
    .sec_05 .font p {font-size:20px}
    .sec_05 .color > div {height:220px;font-size:18px}
    .page_view .list img + img {margin-top:24px}

    .sec_10 {padding:300px 0}
    .sec_10 .title_box .sub {font-size:24px}
    .sec_10 .title_box .tit{font-size:56px}
}

@media all and (max-width: 1023px) {
    .sec_04 .list {flex-direction:column;}
}

@media all and (max-width: 767px) {
    .title_box {margin-bottom:24px;}
    .txt_slide {padding:60px 0}
    .txt_slide p {font-size:80px}
    
    .sec_03 .over_view {margin-top:48px}

    .sec_04 .list .item {width:245px;height:245px;gap:14px 0}
    .sec_04 .list .item .tit {font-size:18px}
    .sec_04 .list .item p {font-size:13px;}
    
    .sec_05 .font .item {font-size:14px}
    .sec_05 .font p {font-size:16px}
    .sec_05 .font p strong {display:block}
    .sec_05 .font .eng {margin:0}
    .sec_05 .color {margin:0;gap:0}
    .sec_05 .color > div {height:150px;font-size:14px}

    .page_view .list img + img {margin-top:15px}

    .sec_10 {padding:120px 0}
    .sec_10 .title_box .sub {font-size:12px}
    .sec_10 .title_box .tit{font-size:32px}
}