@charset "utf-8";

/* 내용관리 */
@media screen and (min-width:1201px) {
.scene-1 { padding:100px 0; position:relative; }
.scene-1 .cont_wrap { position:relative; width:1200px; margin:auto; }
.scene-1 .main_txt { margin:auto; text-align:center; }
.scene-1 .main_txt img { max-width:100%; margin-bottom:50px; }
.scene-1 .main_txt h2 { font-size:36px; line-height:42px; font-family:'GS_B'; color:#000; margin:0; }
.scene-1 .sub_txt { padding:50px 0 0; }
.scene-1 .sub_txt div { display:flex; }
.scene-1 .sub_txt a { display:block; width:33.3333%; color:#666; padding:20px 0; font-family:'GS_M'; font-size:15px; line-height:21px; margin:auto; background-color:#f6f6f6; text-align:center; border:1px solid #ddd; }
.scene-1 .sub_txt .onX { background-color:#09F; color:#fff; border:1px solid #09F; }

.scene-2 { padding:0 0 20px; position:relative; }
.scene-2 .cont_wrap { position:relative; width:1200px; margin:auto; }
.scene-2 .sub_txt {  }
.scene-2 .sub_txt a { display:inline-block; color:#666; padding:0 20px; font-family:'GS_M'; font-size:15px; line-height:40px; line-height:43px; text-align:center; border:1px solid #eee; border-radius:8px; }
.scene-2 .sub_txt .onX { background-color:#000; color:#fff; border:1px solid #000; }

#viewer { width:1200px; height:600px; margin:auto; }
}


@media screen and (max-width:1200px) and (min-width:901px) {
.scene-1 { padding:100px 20px; position:relative; }
.scene-1 .cont_wrap { position:relative; margin:auto; }
.scene-1 .main_txt { margin:auto; text-align:center; }
.scene-1 .main_txt img { max-width:100%; margin-bottom:50px; }
.scene-1 .main_txt h2 { font-size:36px; line-height:42px; font-family:'GS_B'; color:#000; margin:0; }
.scene-1 .sub_txt { padding:50px 0 0; }
.scene-1 .sub_txt div { display:flex; }
.scene-1 .sub_txt a { display:block; width:33.3333%; color:#666; padding:20px 0; font-family:'GS_M'; font-size:15px; line-height:21px; margin:auto; background-color:#f6f6f6; text-align:center; border:1px solid #ddd; }
.scene-1 .sub_txt .onX { background-color:#09F; color:#fff; border:1px solid #09F; }

.scene-2 { padding:100px 0; position:relative; }
.scene-2 .cont_wrap { position:relative; width:1200px; margin:auto; }
.scene-2 .sub_txt { padding:50px 0 0; }
.scene-2 .sub_txt div { display:flex; }
.scene-2 .sub_txt a { display:block; width:33.3333%; color:#666; padding:20px 0; font-family:'GS_M'; font-size:15px; line-height:21px; margin:auto; background-color:#f6f6f6; text-align:center; border:1px solid #ddd; }
.scene-2 .sub_txt .onX { background-color:#09F; color:#fff; border:1px solid #09F; }

#viewer { width:100vw; height:50vw; margin:auto; }
}


@media screen and (max-width:900px) {
.scene-1 { padding:100px 20px; position:relative; }
.scene-1 .cont_wrap { position:relative; margin:auto; }
.scene-1 .main_txt { margin:auto; text-align:center; }
.scene-1 .main_txt img { max-width:100%; margin-bottom:50px; }
.scene-1 .main_txt h2 { font-size:24px; font-family:'GS_B'; color:#000; margin:0; word-break:keep-all; }
.scene-1 .sub_txt { padding:50px 0 0; }
.scene-1 .sub_txt div { display:flex; }
.scene-1 .sub_txt a { display:block; width:33.3333%; color:#666; padding:20px 0; font-family:'GS_M'; font-size:12px; line-height:21px; margin:auto; background-color:#f6f6f6; text-align:center; border:1px solid #ddd; }
.scene-1 .sub_txt .onX { background-color:#09F; color:#fff; border:1px solid #09F; }

.scene-2 { padding:100px 0; position:relative; }
.scene-2 .cont_wrap { position:relative; width:1200px; margin:auto; }
.scene-2 .sub_txt { padding:50px 0 0; }
.scene-2 .sub_txt div { display:flex; }
.scene-2 .sub_txt a { display:block; width:33.3333%; color:#666; padding:20px 0; font-family:'GS_M'; font-size:15px; line-height:21px; margin:auto; background-color:#f6f6f6; text-align:center; border:1px solid #ddd; }
.scene-2 .sub_txt .onX { background-color:#09F; color:#fff; border:1px solid #09F; }

#viewer { width:100vw; height:50vw; margin:auto; }
}