@charset "utf-8";

[class^="scene-"].active .main_txt{visibility:visible !important;}
[class^="scene-"].active .sub_txt{visibility:visible !important;}
[class^="scene-"].active .mobile_wrap{visibility:visible !important;}
[class^="scene-"].active .vi_wrap{visibility:visible !important;}
[class^="scene-"].active .cont_wrap .info_wrap{visibility:visible !important;}

.anchur { position:absolute; top:-50px; }

@media screen and (min-width:901px) {
[class^="scene-"] { position:relative; width:100%; }
[class^="scene-"] .inner { position:relative; z-index:1; }
[class^="scene-"] .cont_wrap { overflow:hidden; }
[class^="scene-"] .main_txt { position: relative; visibility:hidden; }
[class^="scene-"] .sub_txt { position: relative; visibility:hidden; }
[class^="scene-"] .mobile_wrap { position: relative; visibility:hidden; }
[class^="scene-"] .vi_wrap { position: relative; visibility:hidden; }
[class^="scene-"] [class^="status_wrap-"] { display: inline-block;}	

.scene-1 { padding:100px 0; position:relative; }
.scene-1 .cont_wrap { width:1200px; position:relative; margin:auto; }
.scene-1 .main_txt { overflow:hidden; text-align:left; }
.scene-1 .main_txt h2 { font-size:36px; line-height:42px; font-family:'GS_B'; color:#000; margin:0; }
.scene-1 .main_txt p { color:#999; padding:10px 0; font-size:15px; line-height:24px; font-family:'GS_M'; margin:auto; word-break:keep-all; }
.scene-1 .sub_txt { overflow:hidden; text-align:center; padding:100px 0 0; }
.scene-1 .sub_txt > div { position:relative; }
.scene-1 .sub_txt div span { padding:20px; border:1px solid #ddd; background-color:#fff; display:inline-block; margin:0 15px 15px; min-width:110px; box-shadow:0 0 10px rgba(0,0,0,0.1); z-index:1000; position:relative; }
.scene-1 .sub_txt div .l_box { width:50%; margin:auto; text-align:right; position:relative; }
.scene-1 .sub_txt div .l_box span { text-align:center; }
.scene-1 .sub_txt > div > .l_box:after { content:""; visibility:visible; width:40%; height:1px; background-color:#ddd; position:absolute; top:30px; left:50%; z-index:0; }
.scene-1 .sub_txt div ul { display:flex; position:relative; }
.scene-1 .sub_txt div ul:after { content:""; visibility:visible; width:1px; height:100%; background-color:#ddd; position:absolute; top:-90px; left:50%; z-index:0; }
.scene-1 .sub_txt div ul:before { content:""; visibility:visible; width:50%; height:1px; background-color:#ddd; position:absolute; top:35px; left:50%; z-index:0; transform:translateX(-50%); }
.scene-1 .sub_txt div ul li { width:50%; position:relative; }
.scene-1 .sub_txt div ul li div { position:relative; }
.scene-1 .sub_txt div ul li div:after { content:""; visibility:visible; width:1px; height:80%; background-color:#ddd; position:absolute; top:calc(100% - 25px); left:50%; z-index:10; }
.scene-1 .sub_txt div ul li div:last-child:after { visibility:hidden; }
.scene-1 .sub_txt div ul li .l_box { width:70%; margin:auto; text-align:right; }
.scene-1 .sub_txt div ul li .l_box span:after { content:""; visibility:visible; width:80%; height:1px; background-color:#ddd; position:absolute; top:50%; left:-80%; z-index:10; }
.scene-1 .sub_txt div ul li .l_abox { }
.scene-1 .sub_txt div ul li .l_abox span:last-child { position:absolute; top:0px; left:calc(50% + 70px); }
.scene-1 .sub_txt div ul li .l_abox span:last-child:after { content:""; visibility:visible; width:30%; height:1px; background-color:#ddd; position:absolute; top:50%; left:-30%; z-index:10; }
.scene-1 .sub_txt div ul li .thrd_box {}
.scene-1 .sub_txt div ul li .thrd_box:after { content:""; visibility:visible; width:50%; height:1px; background-color:#ddd; position:absolute; top:calc(50% - 7px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .thrd_box:before { content:""; visibility:visible; width:1px; height:80%; background-color:#ddd; position:absolute; top:calc(100% - 25px); left:50%; z-index:10; }
.scene-1 .sub_txt div ul li .two_tbox {}
.scene-1 .sub_txt div ul li .two_tbox span { margin:0 25px 15px; }
.scene-1 .sub_txt div ul li .two_tbox:before { content:""; visibility:visible; width:160px; height:1px; background-color:#ddd; position:absolute; top:calc(-50% - 5px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .two_tbox span:after { content:""; visibility:visible; width:1px; height:calc(100% - 15px); background-color:#ddd; position:absolute; top:calc(-100% + 15px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .two_box {}
.scene-1 .sub_txt div ul li .two_box:before { content:""; visibility:visible; width:160px; height:1px; background-color:#ddd; position:absolute; top:calc(50% - 7px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .hd_box:after { visibility:hidden; }
.scene-1 .sub_txt > div > span { position:absolute; bottom:80px; left:50%; transform:translateX(-50%); margin:0px; } 
}



@media screen and (max-width:900px) {
[class^="scene-"] { position:relative; width:100%; }
[class^="scene-"] .inner { position:relative; z-index:1; }
[class^="scene-"] .cont_wrap { overflow:hidden; }
[class^="scene-"] .main_txt { position: relative; visibility:hidden; }
[class^="scene-"] .sub_txt { position: relative; visibility:hidden; }
[class^="scene-"] .mobile_wrap { position: relative; visibility:hidden; }
[class^="scene-"] .vi_wrap { position: relative; visibility:hidden; }
[class^="scene-"] [class^="status_wrap-"] { display: inline-block;}	

.scene-1 { padding:100px 20px; position:relative; overflow-x:scroll; }
.scene-1 .cont_wrap { width:1200px;  margin:auto; position:relative; margin:auto; }
.scene-1 .main_txt { overflow:hidden; text-align:left; }
.scene-1 .main_txt h2 { font-size:36px; line-height:42px; font-family:'GS_B'; color:#000; margin:0; }
.scene-1 .main_txt p { color:#999; padding:10px 0; font-size:15px; line-height:24px; font-family:'GS_M'; margin:auto; word-break:keep-all; }
.scene-1 .sub_txt { overflow:hidden; text-align:center; padding:100px 0 0; }
.scene-1 .sub_txt > div { position:relative; }
.scene-1 .sub_txt div span { padding:20px; border:1px solid #ddd; background-color:#fff; display:inline-block; margin:0 15px 15px; min-width:110px; box-shadow:0 0 10px rgba(0,0,0,0.1); z-index:1000; position:relative; }
.scene-1 .sub_txt div .l_box { width:50%; margin:auto; text-align:right; position:relative; }
.scene-1 .sub_txt div .l_box span { text-align:center; }
.scene-1 .sub_txt > div > .l_box:after { content:""; visibility:visible; width:40%; height:1px; background-color:#ddd; position:absolute; top:30px; left:50%; z-index:0; }
.scene-1 .sub_txt div ul { display:flex; position:relative; }
.scene-1 .sub_txt div ul:after { content:""; visibility:visible; width:1px; height:100%; background-color:#ddd; position:absolute; top:-90px; left:50%; z-index:0; }
.scene-1 .sub_txt div ul:before { content:""; visibility:visible; width:50%; height:1px; background-color:#ddd; position:absolute; top:35px; left:50%; z-index:0; transform:translateX(-50%); }
.scene-1 .sub_txt div ul li { width:50%; position:relative; }
.scene-1 .sub_txt div ul li div { position:relative; }
.scene-1 .sub_txt div ul li div:after { content:""; visibility:visible; width:1px; height:80%; background-color:#ddd; position:absolute; top:calc(100% - 25px); left:50%; z-index:10; }
.scene-1 .sub_txt div ul li div:last-child:after { visibility:hidden; }
.scene-1 .sub_txt div ul li .l_box { width:70%; margin:auto; text-align:right; }
.scene-1 .sub_txt div ul li .l_box span:after { content:""; visibility:visible; width:80%; height:1px; background-color:#ddd; position:absolute; top:50%; left:-80%; z-index:10; }
.scene-1 .sub_txt div ul li .l_abox { }
.scene-1 .sub_txt div ul li .l_abox span:last-child { position:absolute; top:0px; left:calc(50% + 70px); }
.scene-1 .sub_txt div ul li .l_abox span:last-child:after { content:""; visibility:visible; width:30%; height:1px; background-color:#ddd; position:absolute; top:50%; left:-30%; z-index:10; }
.scene-1 .sub_txt div ul li .thrd_box {}
.scene-1 .sub_txt div ul li .thrd_box:after { content:""; visibility:visible; width:50%; height:1px; background-color:#ddd; position:absolute; top:calc(50% - 7px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .thrd_box:before { content:""; visibility:visible; width:1px; height:80%; background-color:#ddd; position:absolute; top:calc(100% - 25px); left:50%; z-index:10; }
.scene-1 .sub_txt div ul li .two_tbox {}
.scene-1 .sub_txt div ul li .two_tbox span { margin:0 25px 15px; }
.scene-1 .sub_txt div ul li .two_tbox:before { content:""; visibility:visible; width:160px; height:1px; background-color:#ddd; position:absolute; top:calc(-50% - 5px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .two_tbox span:after { content:""; visibility:visible; width:1px; height:calc(100% - 15px); background-color:#ddd; position:absolute; top:calc(-100% + 15px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .two_box {}
.scene-1 .sub_txt div ul li .two_box:before { content:""; visibility:visible; width:160px; height:1px; background-color:#ddd; position:absolute; top:calc(50% - 7px); left:50%; transform:translateX(-50%); z-index:10; }
.scene-1 .sub_txt div ul li .hd_box:after { visibility:hidden; }
.scene-1 .sub_txt > div > span { position:absolute; bottom:80px; left:50%; transform:translateX(-50%); margin:0px; } 
}


