@charset "utf-8";

.page_1 .lineBox{padding: 30px 100px;}
.page_1 .lineBox .a1{margin-left: 148px; margin-top: 10px;}

.page_2 .page-inner{gap:140px}

.page_3 .drag-line{width: 1000px; margin-top: 40px;}
.page_3 .drag-line-group.g1{flex-direction: column; height:100%; gap:60px; left: 0;}
.page_3 .drag-line-group.g2{flex-direction: column; height:100%; gap:20px; right: 0;}

.page_3 .drag-line-item{padding: 10px 40px; min-width: 200px; min-height: 100px; display: flex; justify-content: center; align-items: center;}
.page_3 .c1{left: 220px;}
.page_3 .c2{left: 780px;}
.page_3 .c1.r1{top: 120px;}
.page_3 .c1.r2{top: 280px;}
.page_3 .c2.r1{top: 80px;}
.page_3 .c2.r2{top: 202px;}
.page_3 .c2.r3{top: 324px;}

.page_3 .study_guide{top:-20px; right: 20px;}

.page_4 .table-legend{width: 970px; margin: 0 auto;}

.page_7 .page-inner .oxContainer{
    width: 970px; height: 300px;
}
.page_7 .page-inner .oxContainer::after{
    content: ""; display: block; position: absolute; top:0; left:0;
    width: 100%; height: 100%;
    background: url(../images/proto_km_402/proto_km_401_07.png) no-repeat 50% 50% / 90%;
    z-index: 3;
    pointer-events: none;
}
.page_7 .ox-item{
    position: absolute;
    width: 150px;
    height: 150px;
    z-index: 2;
}
.page_7 .ox-item .icon{width: 100%; height: 100%; margin: 0; top:0; left:0}
.page_7 .ox-item.ox1{top: 70px; left: 109px;}
.page_7 .ox-item.ox2{top: 70px;left: 418px;}
.page_7 .ox-item.ox3{top: 70px;left: 701px;}

.pop_problem[data-popup-page="p1"]{top:220px; left:80px}
.pop_problem[data-popup-page="p2"]{top:220px; left:50px; width: 1260px;}