@charset "utf-8";

:root {
    --main: #0063EA;
}

.mo {display: none;}
.wrapper {max-width:1440px;}

.sec_hero .hero_overlay {position:absolute;inset:0;background:#0d0e1b;opacity:.5;z-index:1;pointer-events:none}
.sec_hero .txt_wrap,
.sec_hero .view_more {z-index: 7;}
.sec_hero .txt_wrap .logo {max-width: 530px}
.sec_hero .view_more .round {background: var(--main);}

.sec_info {background: var(--main); color: #fff;}
.sec_info .cont {color: #fff;}

.sec_overview {padding:var(--sec-padding) 0}
.sec_overview .over_view {margin-top:120px}

.page_view .title_box {display: flex; justify-content: space-between; gap: 20px; margin-bottom: 65px; flex-direction: row;}
.page_view .title_box h2 {font-size: 54px; font-weight: 700;}
.page_view .title_box p {font-size: 20px; line-height: 1.5; color: #585858;}

.page_view .title_box.white h2,
.page_view .title_box.white p {color: #fff;}

.page_view .list {display: flex; justify-content: space-between; align-items: center;}
.page_view .list div {display: flex; flex-direction: column; gap: 60px; box-shadow: none; margin-top: 0 !important;}
.page_view .list div img {width: 100%; box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;}

.page_view .list.col_2 div {width: 50%;}
.page_view .list.col_3 div {width: 33.3%;}
.page_view .list.col_4 div {width: 25%;}
.page_view .list.col_5 div {width: 20%;} 

.page_view.pc_page_view {background: #E9F4FF;}

.page_view.mo_page_view {background: url(img/mo_page_view_bg.jpg) no-repeat center / cover;}
.page_view.mo_page_view .list {align-items: flex-start;}
.page_view.mo_page_view .list div {border-radius: 20px; overflow: hidden;}


@media all and (max-width: 1023px) {

    .pc {display: none;}
    .mo {display: block;}

    .sec_hero .txt_wrap .logo {max-width: 265px;}

    .page_view .title_box {flex-direction: column;}
    .page_view .title_box h2 {font-size: 24px;}
    .page_view .title_box p {font-size: 14px; margin-top: 0;}

    .page_view .list {gap: 20px;}

    .page_view .list div {gap: 20px;}
    .page_view.mo_page_view {background: url(img/mo_page_view_bg_mo.jpg) no-repeat center / cover;}
    .page_view.mo_page_view .list div {border-radius: 5px;}

}
