@charset "utf-8";


.multy_view .sumnail_wrap li a.view_on::after { opacity:0; }
.see_notice { font-weight:600; color:darkorange; text-align:right; padding-right:2%; }
.bird_view { display:block; position:relative; background:url(../img/content/01/bird_view_mod_2022.jpg) no-repeat center center; width:100%; background-size:100% 100%; padding-top:129.147%; }
.link_btn { width:11%; padding:.5em; font-weight:600; min-width:6em; display:block; position:absolute; background-color:#00c01d; text-align:center; opacity:1.0; transform:translate(-100%, -100%);  border-radius:1em; box-sizing:border-box; letter-spacing:-0.5px; font-family:'Paperlogy'; color:#fff!important;}
.link_num { width:30px; height:30px; display:none; position:absolute; font-size:15px;background-color:#00c01d; text-align:center; transform:translate(-100%, -100%); border-radius:50%; line-height:30px; color:#fff!important; font-weight:600;}
.inf_h4 { display:none!important; margin-top:10px !important; margin-bottom:20px; }
.inf_cell { display:none; width:calc(33.33% - 40px); margin-left:20px; margin-bottom:10px; float:left; font-size:15px; font-weight:900; }
.inf_cell p { width:30px; text-align:center; float:left; background-color:#00c01d; height:30px; border-radius:50%; line-height:28px; box-sizing:border-box; color:#fff;}
.inf_cell a { line-height:37px; margin-left:10px; }
.mirinae { top:32.2%; left:32.9%; }
.seoun { top:29.5%; left:31.8%; transform:translate(0%, -100%); }
.seventemple { top:31.1%; left:57.8%; }
.stonetemple { top:33.05%; left:59.2%; transform:translate(0, -100%); }
.goldlake { top:37.5%; left:53.8%; }
.highlake { top:37.5%; left:54.2%; transform:translate(0, -100%); }
.over { top:38.5%; left:42%; }
.campingdong { top:78.95%; left:81%; }
.place3 { top:48%; left:43%; }
.okland { top:48.7%; left:64.5%; }
.farmland { top:51.2%; left:63.9%; transform:translate(0%, -100%); }
.culturepark { top:57.6%; left:58.9%; }
.grasspark { top:63.8%; left:67%; }
.multyplace { top:62.85%; left:63.5%; }
.outplace { top:73.8%; left:72%; }
.place1 { top:75.95%; left:91.5%; }
.place2 { top:86.5%; left:65.5%; }
.campingdong2 { top:41.5%; left:48.2%; }
.visitcenter { top:82.9%; left:90%; }
.parking1 { top:93.3%; left:85.2%; }
.parking2 { top:88.6%; left:97.3%; }
.caravan { top:51.5%; left:53.5%; }

.sub02 .em { font-weight:900; color:orange; }
.multy_view { width:calc(100% - 20px); padding-top:53.33%; border-radius:12px; background-color:#d47c72; overflow:hidden; left:20px; box-sizing:border-box; position:relative; margin-top:10px; }
.multy_view::before { content:''; width:1px; padding-top:calc(53.33% - 24px); border-right:dashed 1px rgba(255,255,255,0.5); margin-left:12px; position:absolute; display:block; top:19px; left:calc(80% - 14px); }
.multy_view .main_view { width:calc(80% - 24px); height:calc(100% - 24px); border-radius:12px; border:solid 3px #fff; overflow:auto; overflow-x:hidden; left:12px; top:12px; box-sizing:border-box; position:absolute; }
.multy_view .main_img { min-width:100%; min-height:100%; overflow:auto; }
.multy_view div.sumnail_wrap_wrap { width:calc(20% - 24px); height:calc(100% - 24px); border-radius:12px; right:12px; top:12px; box-sizing:border-box; position:relative; background-color:#fff; overflow:auto; }
.multy_view ul.sumnail_wrap { width:100%; height:100%; position:absolute; overflow:auto; }
.multy_view .sumnail_wrap li { width:calc(100% - 12px); height:calc(25% - 7.5px); border-radius:6px; border:solid 3px #eabeb9; margin-left:6px; margin-top:6px; float:left; box-sizing:border-box; position:relative; overflow:hidden; }
.multy_view .sumnail_wrap li:last-child { margin-bottom:6px; margin-right:6px; }
.multy_view .sumnail_wrap li a::after { content:''; width:calc(100% + 6px); height:calc(100% + 6px); border-radius:6px; top:-3px; left:-3px; background-color:#fff; z-index:10; display:block; box-sizing:border-box; position:absolute; transition:0.5s; opacity:0.5; }
.multy_view .sumnail_wrap li a { display:block; width:101%; height:101%; }



@media all and (min-width:1025px) { 
    .min_1025 { display:block; } 
    .max_1024 { display:none !important; } 
    .link_btn::after { content:""; width:400%; padding-top:300%; position:absolute; left:0; top:3px; display:block; opacity:0; z-index:20; transform:translateY(-100%); transition:0.5s; border-radius:5px; border:2px solid white; } 
    .link_btn:hover::after { opacity:1; top:-2px; } 
    .link_btn { overflow:hidden; } 
    .link_btn:hover { overflow:visible; } 
    .mirinae::after { background:url(../img/content/01/exam_1.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .seoun::after { background:url(../img/content/01/exam_2.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .seventemple::after { background:url(../img/content/01/exam_3.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .stonetemple::after { background:url(../img/content/01/exam_4.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .goldlake::after { background:url(../img/content/01/exam_5.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .highlake::after { background:url(../img/content/01/exam_6.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .over::after { background:url(../img/content/01/exam_7.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .campingdong::after { background:url(../img/content/01/exam_8.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .place3::after { background:url(../img/content/01/exam_9.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .okland::after { background:url(../img/content/01/exam_10.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .farmland::after { background:url(../img/content/01/exam_11.JPG) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
    .culturepark::after { background:url(../img/content/01/exam_12.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .grasspark::after { background:url(../img/content/01/exam_13.JPG) no-repeat center center; background-size:100% 100%; z-index:20; }
    .multyplace::after { background:url(../img/content/01/exam_14.png) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
    .outplace::after { background:url(../img/content/01/exam_15.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .place1::after { background:url(../img/content/01/exam_16.JPG) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
    .place2::after { background:url(../img/content/01/exam_17.JPG) no-repeat center center; background-size:100% 100%; z-index:20; } 
    .campingdong2::after { background:url(../img/content/01/exam_18.JPG) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
    .visitcenter::after { background:url(../img/content/01/exam_19.JPG) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
    .parking1::after { background:url(../img/content/01/exam_20.JPG) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
    .caravan::after { background:url(../img/content/01/exam_22.jpg) no-repeat center center; background-size:100% 100%; transform:translate(-100%,-100%); margin-left:80px; z-index:20; } 
}
@media all and (max-width:1024px) { 
    .min_1025 { display:none; } 
    .max_1024 { display:block; } 
    .close_view { width:86%; padding-top:53%; border-radius:10px; border:solid 3px white; overflow:hidden; left:7%; box-sizing:border-box; box-shadow:4px 4px 4px rgba(0,0,0,0.5); position:absolute; top:50%; transform:translateY(-50%); display:none; z-index:-10; } .close_view .btn_close { border-radius:5px; width:32px; height:32px; position:absolute; top:20px; right:20px; background-color:#fff; background:url(../img/content/01/btn_close.png) no-repeat center center; background-size:100%; opacity:0.5; display:block; color:rgba(0,0,0,0); } .close_view .btn_go { border-radius:5px; width:170px; height:40px; position:absolute; bottom:20px; right:20px; background-color:rgba(255,255,255,0.8); line-height:42px; box-shadow:0 0 3px white; font-size:20px; text-align:center; display:none; } 
}


@media all and (max-width:780px) { 
    .multy_view { padding-top:83.325% !important; } 
    .multy_view .main_view { width:calc(100% - 24px) !important; height:calc(80% - 24px) !important; } 
    .multy_view::before { width:calc(100% - 24px) !important; padding-top:1px !important; border-right:0 !important; border-bottom:dashed 1px rgba(255,255,255,0.5); top:calc(80% - 2px) !important; left:0px !important; } 
    .multy_view div.sumnail_wrap_wrap_viewport { width:calc(100% - 24px) !important; height:calc(20% - 24px) !important; margin-bottom:12px; bottom:0; top:inherit !important; position:absolute; overflow:hidden; margin-left:12px; border-radius:12px; } 
    .multy_view div.sumnail_wrap_wrap { width:100%; height:100%; margin:0px; bottom:inherit; top:0 !important; right:0px; } 
    .sumnail_wrap_viewport { width:100%; height:100%; background-color:#fff; overflow:auto; } 
    .multy_view .sumnail_wrap { white-space:nowrap; } 
    .multy_view .sumnail_wrap li { width:100px !important; height:calc(100% - 12px) !important; } 
    .multy_view ul.sumnail_wrap.s01 { width:119px; } 
    .multy_view ul.sumnail_wrap.s02 { width:226px; } 
    .multy_view ul.sumnail_wrap.s03 { width:333px; } 
    .multy_view ul.sumnail_wrap.s04 { width:440px; } 
    .multy_view ul.sumnail_wrap.s05 { width:552px; } 
    .multy_view ul.sumnail_wrap.s06 { width:654px; } 
    .multy_view ul.sumnail_wrap.s07 { width:761px; } 
    .multy_view ul.sumnail_wrap.s08 { width:868px; } 
    .multy_view ul.sumnail_wrap.s09 { width:975px; } 
    .multy_view ul.sumnail_wrap.s10 { width:1082px; } 
    .multy_view ul.sumnail_wrap.s11 { width:1189px; } 
}

@media all and (max-width:700px) { 
    .multy_view { padding-top:calc(76% + 66px) !important; } 
    .multy_view .main_view { height:calc(100% - 132px) !important; } 
    .multy_view div.sumnail_wrap_wrap_viewport { height:94px !important; bottom:12px; margin-bottom:0px; } 
    .multy_view div.sumnail_wrap_wrap { height:94px; } 
    .multy_view::before { bottom:112px; top:inherit !important; } 
    .view_selected { border:solid 3px #d47c72; } 
    .link_num { display:block; } 
    .link_btn { display:none; } 
    .inf_h4 { display:inherit!important;; } 
    .inf_cell { display:block; } 
}


@media all and (max-width:550px) { 
    .inf_cell { width:calc(50% - 30px); margin-bottom:5px; } 
}