
#header .logo{display:flex; align-items: center; }
#header .logo a p{display:block; width:140px; height:24px; background:url("/site/ddmmap/images/main/dataplatform_logo.svg")center center no-repeat; background-size:100%; margin-left:12px; font-size:0px;}
.lnb .menu .depth1_item{margin-left:150px;}
.lnb_open .lnb .menu{box-shadow:none;}
.lnb .menu{border-bottom:1px solid #E7E8EC; background:#F5F6F9; max-height:fit-content;}
.lnb_open .lnb .menu{border-bottom:1px solid #e7e8ec;}
.lnb .menu::before{content:""; display:block; position:absolute; left:0px; top:0px; width:100%; height:100%; background:#fff; max-height:64px;}
.lnb .menu .depth2_content{padding:24px 0px;}
.lnb .menu .depth2_text{line-height:140%; font-size:18px; color:#646668; font-weight:500;}
.lnb .menu .depth2_item{width:auto;}
.lnb .menu .depth2_text:before{background:#009BFA; bottom:0px; transform:ScaleX(0);}
.lnb .menu .depth2_text:is(:hover,:focus):before{transform:scaleX(1);}
#container{background:url("/site/ddmmap/images/main/flow.svg")center bottom no-repeat; background-size:cover; height:fit-content; margin-bottom:0px; padding:80px 0px;}

.data-platform-wrap{display:flex; gap:0px 30px; align-items: stretch; justify-content: center;}
.data-platform-wrap.type1{margin-bottom:30px;}
.data-platform-wrap li a{position:relative; display:flex; padding:40px; transition-duration:0.2s; border:3px solid transparent; outline:1px solid #E7E8EC; box-shadow:0 0 4px 0 rgba(0, 0, 0, 0.15); gap:24px 20px; height:100%; background:#fff;}
.data-platform-wrap li a div{display:flex; flex-direction: column; gap:12px 0px;}
.data-platform-wrap li a div strong{font-size:24px; color:#121212; font-weight:600;}
.data-platform-wrap li a div p{font-size:16px; color:#8A9096; line-height:130%;}
.data-platform-wrap li a:is(:hover,:focus){border:3px solid #ff3a99; box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.25);  outline:1px solid transparent;}
.data-platform-wrap.type1 li a{flex-direction: column; }
.data-platform-wrap.type1 li{width:450px;}
.data-platform-wrap.type2 li{width:560px;}
.data-platform-wrap.type2 li a{align-items: center;}
.data-platform-wrap li a::before{content:""; display:block; width:134px; height:134px;}
.data-platform-wrap.type1 li a::before{margin-left:auto;}
.data-platform-wrap.type1 li:nth-of-type(1) a::before{background:url("/site/ddmmap/images/main/data_icon1.svg")center center no-repeat; background-size:100%;}
.data-platform-wrap.type1 li:nth-of-type(2) a::before{background:url("/site/ddmmap/images/main/data_icon2.svg")center center no-repeat; background-size:100%;}
.data-platform-wrap.type1 li:nth-of-type(3) a::before{background:url("/site/ddmmap/images/main/data_icon3.svg")center center no-repeat; background-size:100%;}
.data-platform-wrap.type2 li:nth-of-type(1) a::before{background:url("/site/ddmmap/images/main/data_icon4.svg")center center no-repeat; background-size:100%;}
.data-platform-wrap.type2 li:nth-of-type(2) a::before{background:url("/site/ddmmap/images/main/data_icon5.svg")center center no-repeat; background-size:100%;}
.data-platform-wrap a::after{content:""; position:absolute; display:block; width:30px; height:30px; background:url("/site/ddmmap/images/main/data_icon_arrow.svg")center center no-repeat; background-size:100%; opacity:0; transition-duration:0.2s; transform-origin:left; transform:scaleX(0);}
.data-platform-wrap a:is(:hover,:focus)::after{opacity:1; transform:scaleX(1);}
.data-platform-wrap.type1 a::after{ left:40px; top:92px;}
.data-platform-wrap.type2 a::after{ right:40px; top:92px}

@media all and (max-width:1200px){
    #container{padding:40px 0px;}
    .data-platform-wrap{flex-wrap:wrap; gap:15px;}
    .data-platform-wrap.type1{margin-bottom:15px;}
    .data-platform-wrap.type1 li{width:90%;}
    .data-platform-wrap.type2 li{width:90%;}
    .data-platform-wrap li a{padding:20px;}
    .data-platform-wrap li a::before{width:20vw; height:auto; aspect-ratio:1/1;}
    .data-platform-wrap.type1 li a{flex-direction: row; align-items: center; }
    .data-platform-wrap.type1 li a::Before{margin-left:0px;}
    .data-platform-wrap.type1 li a::after{left:unset; right:20px; top:50%;}
    .data-platform-wrap.type2 li a::after{left:unset; right:20px; top:50%;}
    .data-platform-wrap li a div strong{font-size:16px;}
    .data-platform-wrap li a div p{font-size:14px;}
}