﻿html {
    width: 100%;
    overflow-x: hidden;
}

body {
    width: 100%;
    overflow-x: hidden;
    position: relative;
}

/* common wrap */
.wrap {
    width: 1280px;
    margin: 0 auto;
    max-width: 100%;
}

.wrap_960 {
    width: 960px;
    margin: 0 auto;
    max-width: 100%;
}

.wrap_800 {
    width: 800px;
    margin: 0 auto;
    max-width: 100%;
}

/* Header */
#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    z-index: 999;
    background: #fff;
    overflow: hidden;
    transition: background-color .4s, height .4s, box-shadow .4s;
    background-position-x: calc(((50% - 385px) / 2) - 40px);
    background-position-y: 150px;
    background-repeat: no-repeat;
}

#header.show {
    height: 430px;
    background-image: url("../images/common/header_icon_1.png");
    background-repeat: no-repeat;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

#header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100px;
    z-index: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.headerShadow {
    position: fixed;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100px;
    z-index: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

#header h1 {
    position: absolute;
    top: 0;
    left: 0px;
    height: 100px;
    width: calc(50vw - 385px);
}

#header h1 a {
    display: block;
    width: 180px;
    margin: 0 auto;
}

#header h1 a object {
    width: 180px;
    margin-top: 9px;
    position: relative;
    z-index: -1;
}

#header .mobilebox {
    width: 770px;
    margin: 0 auto;
    transform: none;
}

#header .gnb {
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: 0;
}

#header .gnb>li {
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    width: 20%;
    height: 100px;
    line-height: 100px;
    position: relative;
    text-align: left;
}

#header .gnb>li>a {
    display: block;
    padding-left: 10px;
}

#header .gnb li a:hover {
    text-decoration: underline;
}

#header .gnb li .color_bar {
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0px;
    height: 4px;
    background: #e60000;
    transition: width .3s;
}

#header .gnb li:hover .color_bar {
    width: 100%;
}

#header .gnb .lnb {
    display: block;
    position: absolute;
    top: 100px;
    left: 0;
    width: 100%;
    height: 330px;
    border-left: 1px solid #ddd;
    padding-top: 10px;
    box-sizing: border-box;
}

#header .gnb li:last-child .lnb {
    border-right: 1px solid #ddd;
}

#header .gnb .lnb li {
    display: block;
    text-align: left;
    padding: 0 10px;
    line-height: 30px;
    position: relative;
}

#header .gnb .lnb li .lnb_line::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 10px;
    width: 132px;
    height: 1px;
    background: #bbb4ba;
}

#header .gnb .lnb li a {
    font-size: 14px;
    padding: 0;
    width: 100%;
    display: block;
    letter-spacing: -1px;
}

#header .lang_btn {
    position: absolute;
    top: 0;
    right: 0px;
    width: calc(50vw - 385px);
}

#header .lang_btn img {
    width: 80px;
    margin: 0 auto;
    display: block;
}

#header .hamburger {
    display: none;
}

/* main header show animation */
.mainHTML.load {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.mainHTML #header {
    background-color: transparent;
}

.mainHTML #header:hover {
    background-color: #fff;
}

.mainHTML #header .gnb:hover .header_bg {
    opacity: 1;
}

.mainHTML #header .gnb .lnb {
    border-left: 1px solid #dddddd00;
    transition: border .4s;
}

.mainHTML #header .gnb:hover .lnb {
    border-left: 1px solid #dddddd;
}

.mainHTML #header .gnb li:last-child .lnb {
    border-right: 1px solid #dddddd00;
}

.mainHTML #header .gnb:hover li:last-child .lnb {
    border-right: 1px solid #dddddd;
}

.mainHTML #header .gnb li a {
    transition: color .5s;
}

.mainHTML #header:hover .gnb li a {
    color: #000 !important;
}

.mainHTML #header .gnb.white li a {
    color: #fff;
}

.mainHTML iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1920px;
    z-index: -1;
}

/* main */
#main {
    overflow: hidden;
}

#main video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 1920px;
}

#main .scrolldown_icon {
    position: absolute;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
    width: 41px;
    height: 65px;
    border: 2px solid #fff;
    border-radius: 21px;
    box-sizing: border-box;
}

#main .scrolldown_icon::before {
    content: '';
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    opacity: 0;
    animation: scrollMouse 2s ease-in-out infinite;
}

@keyframes scrollMouse {
    0% {
        opacity: 0;
        top: 15px;
    }

    10% {
        opacity: 1;
        top: 15px;
    }

    90% {
        opacity: 1;
        top: 38px;
    }

    100% {
        opacity: 0;
        top: 38px;
    }
}

#main .scrolldown_icon::after {
    content: 'SCROLL';
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    letter-spacing: 0.2em;
}

/* common section */
.mainHTML .section {
    box-sizing: border-box;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    backface-visibility: hidden;
    height: 100vh;
    overflow: hidden;
}

.mainHTML .wrap {
    width: 80%;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

.mainHTML .text_box {
    width: 100%;
    height: 100%;
    float: left;
    background-size: cover;
    box-sizing: border-box;
    padding: 6.5em 0 0 10em;
    background-repeat: no-repeat;
    background-size: auto;
    opacity: 0;
    margin-left: -30px;
    transition: opacity 1.0s, margin 1.0s;
    transition-timing-function: ease-in-out;
    transition-delay: .5s;
}

.mainHTML .text_box h2 {
    font-size: 2.5em;
    font-weight: 500;
}

.mainHTML .text_box h3 {
    font-size: 1.4em;
}

.mainHTML .text_box p {
    font-size: 1.4em;
    margin-top: 1.25em;
}

.mainHTML .text_box b {
    font-weight: 600;
}

.mainHTML .section .img_box {
    width: 23%;
    border-radius: 5px;
    padding: 5px;
    position: absolute;
    border: 2px solid;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    opacity: 0;
    transition: opacity 1s;
    transition-timing-function: ease-in-out;
    transition-delay: .5s;
}

.mainHTML .section .img_box img.hover {
    transform: scale(1.1);
}

.mainHTML .section .img_box .box {
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    border: 2px solid;
}

.mainHTML .section .img_box img {
    width: 100%;
    vertical-align: bottom;
    transition: transform .3s;
}

.mainHTML .section.active[data-rotate] .text_box {
    opacity: 1;
    margin-left: 0;
}

.mainHTML .section.active[data-rotate] .img_box {
    opacity: 1;
}

.mainHTML .section.active[data-rotate] .img_box:nth-child(3) {
    transition-delay: 1s;
}

/* section social */
#social {
    background-image: url("../images/common/main/bg/section1_line.png"), url("../images/common/main/bg/section1_drone.png"), url("../images/common/main/bg/section1_bg.jpg");
    background-position: center, top -40px center, center;
    animation: socialdrone 4s cubic-bezier(.6, .02, .43, .96) infinite;
}

@keyframes socialdrone {
    0% {
        background-position: center, top -30px center, center;
    }

    50% {
        background-position: center, top 10px center, center;
    }

    100% {
        background-position: center, top -30px center, center;
    }
}

#social .text_box {
    background-image: url("../images/common/cp_bg.png");
    background-position: 0.8em 1em;
}

#social .text_box h3 {
    color: #ff3939;
}

#social .img_box {
    border-color: #ef4023;
}

#social .img_box .box {
    border-color: #ef4023;
}

#social .img_box:nth-child(2) {
    top: 20px;
    right: 0;
}

#social .img_box:last-child {
    top: 210px;
    right: 430px;
}

/* section videoManage */
#videoManage {
    background-image: url("../images/common/main/bg/section2_line.png");
    background-size: auto;
    position: relative;
}

#videoManage .icon {
    width: 403px;
    height: 403px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 260px 0 0 -600px;
    z-index: 10;
}

#videoManage .icon .bg_img {
    background: url("../images/common/main/bg/section2_icon.png") no-repeat center;
    background-size: 90%;
    width: 100%;
    height: 100%;
    transition: background-size .5s;
}

#videoManage .icon:hover .bg_img {
    background-size: 100%;
}

#videoManage .text_box {
    background-image: url("../images/common/cp_bg_2.png");
    background-position: 5em 0.5em;
    background-size: 550px;
}

#videoManage .text_box h3 {
    color: #0095da;
}

#videoManage .img_box {
    width: 26%;
    top: 100px;
    right: 270px;
    border-color: #0095da;
}

#videoManage .img_box .box {
    border-color: #0095da;
}

/* section disaster */
#disaster {
    background-image: url("../images/common/main/bg/section3.jpg");
}

#disaster .text_box {
    background-image: url("../images/common/cp_bg_3.png");
    background-position: 5em 1.5em;
}

#disaster .text_box h3 {
    color: #f8b932;
}

#disaster .img_box {
    border-color: #ffcb08;
}

#disaster .img_box .box {
    border-color: #ffcb08;
}

#disaster .img_box:nth-child(2) {
    top: 20px;
    right: 0;
}

#disaster .img_box:last-child {
    top: 250px;
    right: 360px;
}

/* section environment */
#environment {
    background-image: url("../images/common/main/bg/section4.jpg");
}

#environment .text_box {
    background-image: url("../images/common/cp_bg_4.png");
    background-position: 5em 1em;
}

#environment .text_box h3 {
    color: #9bd02a;
}

#environment .img_box {
    top: 100px;
    right: 270px;
    width: 28%;
    border-color: #b7d860;
}

#environment .img_box .box {
    border-color: #b7d860;
}

/* section csr */
#csr {
    position: relative;
    background: #eff0f0;
}

#csr object {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

#csr p {
    display: none;
    position: absolute;
    left: 8%;
    bottom: 28%;
    font-size: 30px;
}

/* section shortcut */
#shortcut {
    background-image: url("../images/common/main/bg/section6.jpg");
    position: relative;
}

#shortcut .textbox h2 {
    text-align: center;
    font-size: 1.5em;
    margin-bottom: 1.5em;
    font-weight: 400;
}

#shortcut .textbox h2 b {
    font-weight: 600;
}

#shortcut .shortcut_box {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1040px;
    height: 100%;
    transform: translateX(-50%);
    padding: 100px 0 160px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

#shortcut .shortcut_box .card_box {
    font-size: 0;
    width: 100%;
    height: 40vh;
}

#shortcut .shortcut_box .card_box>a {
    display: inline-block;
    width: 25%;
    height: 100%;
    box-sizing: border-box;
    font-size: 2em;
    vertical-align: top;
    position: relative;
    perspective: 600px;
}

#shortcut .shortcut_box .box {
    width: 100%;
    height: 100%;
    transition: transform .7s;
    transform-style: preserve-3d;
    position: relative;
}

#shortcut .shortcut_box .box .box_face {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-repeat: no-repeat;
    background-position: center;
}

#shortcut .shortcut_box .box .box_front {
    border: 1px solid #000;
    background-color: #fff;
    box-sizing: border-box;
}

#shortcut .shortcut_box .box .box_back {
    transform: rotateY(180deg) scale(1.05);
    background-size: cover;
}

#shortcut .shortcut_box .box .box_front span {
    font-size: 24px;
    font-weight: 400;
    margin-top: 37px;
    color: #000;
}

#shortcut .shortcut_box .box .box_back span {
    font-size: 24px;
    font-weight: 400;
    margin-top: 37px;
    margin-bottom: 20px;
    color: #fff;
}

#shortcut .shortcut_box .box .box_back p.text {
    font-size: 16px;
    color: #fff;
    text-align: center;
}

#shortcut .shortcut_box .box .box_back p.more {
    font-size: 20px;
    margin-top: 60px;
    color: #fff;
}

#shortcut .shortcut_box .box .box_face a {
    display: block;
}

#shortcut .shortcut_box .box1 .box_back {
    background-image: url("../images/common/main/shortcut1.jpg");
}

#shortcut .shortcut_box .box2 .box_back {
    background-image: url("../images/common/main/shortcut2.jpg");
}

#shortcut .shortcut_box .box3 .box_back {
    background-image: url("../images/common/main/shortcut3.jpg");
}

#shortcut .shortcut_box .box4 .box_back {
    background-image: url("../images/common/main/shortcut4.jpg");
}

#shortcut .shortcut_box .card_box>a:hover {
    z-index: 2;
}

#shortcut .shortcut_box .card_box>a:hover .box {
    transform: rotateY(180deg);
    z-index: 2;
}

/* quickmenu */
#quickmenu {
    position: absolute;
    top: -100vh;
    right: 10px;
    width: 80px;
    height: 100vh;
    background: url("../images/common/quickmenu_bg.png") center repeat-y;
    transition: top .7s, height .7s, bottom .7s;
}

#quickmenu ul {
    background: url("../images/common/quickmenu_img_light.png") no-repeat bottom;
    padding-bottom: 24px;
    position: absolute;
    bottom: 0;
    width: 100%;
    margin-bottom: 80px;
    animation: railLight 1s linear infinite;
}

@keyframes railLight {
    0% {
        background-image: none;
    }

    90% {
        background-image: url("../images/common/quickmenu_img_light.png")
    }
}

#quickmenu li {
    text-align: center;
    line-height: 0;
}

#quickmenu li img {
    width: 60px;
    transition: .2s;
}

#quickmenu li:hover img {
    transform: scale(1.2);
}

/* rotate logo */
#rotate-logo {
    position: absolute;
    bottom: -75vh;
    right: -30vh;
    width: 60vh;
    height: 60vh;
    transition: bottom 0.7s, transform 0.7s;
}

#rotate-logo img {
    width: auto;
    height: 30vh;
    float: left;
}

#rotate-logo img:nth-child(2) {
    transform: rotate(90deg);
}

#rotate-logo img:nth-child(3) {
    transform: rotate(270deg);
}

#rotate-logo img:nth-child(4) {
    transform: rotate(180deg);
}

/* loading page */
.load_page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.load_page img {
    width: 75vw;
}

/* side navigation dot */
#fp-nav ul li a.active span {
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    background: #a5a5a5;
}

#fp-nav ul li a span {
    width: 10px;
    height: 10px;
    margin: -5px 0 0 -5px;
    background: #131313;
}

#fp-nav ul li {
    margin: 18px;
}

/* footer */
#footer {
    background: #686565;
    width: 100%;
    height: 120px;
    color: #fff;
}

.section #footer {
    position: absolute;
    bottom: 0;
    left: 0;
}

/* main 화면의 footer */
#footer .ft_wrap {
    width: 1280px;
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}

#footer .ft_bt {
    width: 100%;
}

#footer .ft_bt .ft_logo {
    float: left;
    width: 137px;
    height: 47px;
}

#footer .ft_bt .ft_logo img {
    border: 0;
}

#footer .ft_bt p {
    margin-left: 92px;
    width: 623px;
    float: left;
    line-height: 1.5;
}

#footer .ft_bt .fax {
    float: right;
}

#footer .mobileBR {
    display: none;
}



/* common subpage */
#sub_banner {
    width: 100%;
    height: 400px;
    background-repeat: repeat-x;
    background-position: center;
    background-size: cover;
    margin-top: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: #fff;
    user-select: none;
}

#sub_banner h2 {
    font-size: 60px;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.5);
    font-weight: 500;
}

#sub_banner p {
    font-size: 24px;
    letter-spacing: 1px;
}

#sub_nav {
    width: 100%;
    z-index: 1;
    position: relative;
}

#sub_nav .nav_now {
    width: 100%;
    height: 50px;
}

#sub_nav .nav_now ul {
    font-size: 0;
    padding-top: 13px;
    box-sizing: border-box;
}

#sub_nav .nav_now ul li {
    font-size: 16px;
    display: inline-block;
    padding-right: 45px;
    position: relative;
}

#sub_nav .nav_now ul li::before {
    content: '';
    display: block;
    position: absolute;
    left: -26px;
    top: 5px;
    width: 11px;
    height: 12px;
    background: url("../images/common/sub_nav_arrow.png");
}

#sub_nav .nav_now ul li:first-child::before {
    background: transparent;
}

#sub_nav .nav_now ul li img {
    vertical-align: -4px;
}

#sub_nav #sub-navigation {
    display: none;
}

#sub_nav .sub_navlist {
    position: absolute;
    top: 120px;
    left: 0px;
    line-height: 2;
    font-weight: 700;
}

#sub_nav .sub_navlist ul li a {
    padding-left: 50px;
    color: #9c9c9c;
    position: relative;
    font-size: 18px;
    display: block;
}

#sub_nav .sub_navlist ul li a:hover {
    color: #333;
}

#sub_nav .sub_navlist ul li a.active {
    color: #e13939;
}

#sub_nav .sub_navlist ul li a::after {
    content: '';
    position: absolute;
    bottom: 50%;
    left: 0;
    display: block;
    width: 0;
    height: 3px;
    margin-bottom: -1.5px;
    background: #e13838;
    transition: width .3s;
}

#sub_nav .sub_navlist ul li a.active::after {
    animation: subNavShow .5s forwards;
}

@keyframes subNavShow {
    0% {
        width: 0;
    }

    100% {
        width: 35px;
    }
}

#sub_nav .sub_navlist ul li a.active::after,
#sub_nav .sub_navlist ul li a:hover::after {
    width: 35px;
}

/* subpage introduce */
#sub_banner.intro {
    background-image: url("../images/common/sub_intro_banner.jpg");
}

#sub_intro .intro {
    width: 100%;
    text-align: center;
    margin-top: 100px;
}

#sub_intro .intro img {
    width: 100%;
}

#sub_intro .intro img.mobile {
    display: none;
}

#sub_intro .intro .link_box {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    margin: 30px auto 80px;
}

#sub_intro .intro .link_box .main_ci {
    width: 200px;
    display: inline-flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-right: 20px;
}

#sub_intro .intro .link_box .main_ci img.logo {
    width: 200px;
}

#sub_intro .intro .link_box .main_ci img {
    width: 100px;
    margin-bottom: -7px;
}

#sub_intro .intro .youtube {
    position: relative;
}

#sub_intro .intro .youtube img {
    width: 100px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#sub_intro .intro .youtube p {
    font-weight: 500;
    font-size: 16px;
}

#sub_intro .intro .youtube:hover img,
#sub_intro .intro .youtube:focus img {
    background-image: url("../images/common/icon/youtube_icon_bg.png");
}

#sub_organ .organ {
    text-align: center;
    margin: 200px auto 150px;
}

#sub_map {
    margin: 200px 0 100px;
}

#sub_map .map_title {
    background: url("../images/common/sub_map_title.png") no-repeat top center;
    width: 100%;
    height: 190px;
    margin-bottom: 100px;
}

#sub_map .map {
    margin-bottom: 100px;
    width: 100%;
}

#sub_map .map h3 {
    text-align: center;
    font-size: 30px;
    margin-bottom: 30px;
}

#sub_map .map ul {
    font-size: 0;
}

#sub_map .map ul li {
    display: inline-block;
    font-size: 16px;
    margin-top: 10px;
}

#sub_map .map .guide_box {
    display: inline-block;
    background: #e13838;
    padding: 5px;
    margin-right: 10px;
    color: #fff;
}

#sub_map .map .guide_text {
    margin-right: 20px;
}

#sub_map .map li:first-child {
    display: block;
}

#sub_map .map li:nth-child(2) {
    margin-right: 50px;
}

#sub_map .map_box {
    width: 800px;
    max-width: 90vw;
    height: 400px;
    border: 1px solid #b4b4b4;
    box-sizing: border-box;
    margin: 20px auto 0;
}

#sub_history {
    width: 100%;
    margin: 200px auto 100px;
    position: relative;
    background-repeat: no-repeat;
    background-position: top center;
}

#sub_history .wrap_960 {
    position: relative;
    max-width: 100%;
    text-align: center;
}

#sub_history img {
    max-width: 90%;
}

#sub_history .history_nav {
    position: absolute;
    bottom: 50px;
    left: 131px;
    width: 120px;
}

#sub_history .history_nav a {
    display: block;
    color: #f1acac;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.8;
}

#sub_history .history_nav a:hover {
    color: #f15d5e;
}


/* subpage social */
#sub_banner.business {
    background-image: url("../images/common/sub_business_banner.jpg");
}

#sub_business {
    margin: 150px auto 100px;
}

#sub_business .sub_business_title {
    text-align: center;
}

#sub_business .sub_business_title h3 {
    font-size: 36px;
}

#sub_business .sub_business_title h3 strong {
    color: #c3482d;
}

#sub_business .sub_business_title p {
    font-size: 18px;
    font-weight: 500;
    margin: 40px 0 70px;
}

#sub_business .sub_business_imgbox_1 .imgbox {
    width: 350px;
    height: 475px;
    float: left;
    position: relative;
}

#sub_business .sub_business_imgbox_1 .imgbox:nth-child(2n) {
    float: right;
}

#sub_business .sub_business_imgbox_1 .imgbox img {
    width: 350px;
    height: 200px;
    display: block;
    opacity: 0;
    transition: opacity .8s
}

#sub_business .sub_business_imgbox_1 .imgbox .box_text {
    opacity: 0;
    transition: opacity .8s
}

#sub_business .sub_business_imgbox_1 .imgbox h4 {
    text-align: center;
    font-size: 22px;
    color: #000;
    margin: 15px 0 15px;
}

#sub_business .sub_business_imgbox_1 .imgbox li {
    color: #515151;
    text-indent: 1px;
    font-size: 16px;
    line-height: 1.5;
}

#sub_business .sub_business_imgbox_1 .imgbox .smartSensor {
    width: 350px;
    height: 200px;
    border: 1px solid #b4b4b4;
    box-sizing: border-box;
    text-align: center;
}

#sub_business .sub_business_imgbox_1 .imgbox .smartSensor img {
    width: auto;
    height: 100%;
    display: inline;
}

#sub_business .sub_business_imgbox_2 {
    margin-bottom: 100px;
}

#sub_business .sub_business_imgbox_2 .imgbox {
    width: 30%;
    height: 400px;
    margin-right: 5.0%;
    float: left;
    position: relative;
}

#sub_business .sub_business_imgbox_2 img {
    opacity: 0;
    transition: opacity .8s
}

#sub_business .sub_business_imgbox_2 .box_text {
    opacity: 0;
    transition: opacity .8s
}

#sub_business .sub_business_imgbox_2 .imgbox:nth-child(3n) {
    float: right;
    margin-right: 0;
}

#sub_business .sub_business_imgbox_2 .imgbox h4 {
    font-size: 18px;
    font-weight: 600;
    margin: 15px 0;
    text-align: center;
}

#sub_business .sub_business_imgbox_2 .imgbox li {
    font-size: 14px;
    line-height: 1.2;
    margin-bottom: 5px;
    color: #515151;
    padding: 0 0 0 10px;
    position: relative;
}

#sub_business .sub_business_imgbox_2 .imgbox li::before {
    content: '-';
    position: absolute;
    top: -2px;
    left: 0px;
}

#sub_business .imgbox .more {
    position: absolute;
    right: 0;
    bottom: 60px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #bf2525;
    text-align: center;
    line-height: 50px;
    transition: background .2s;
}

#sub_business .imgbox .more a {
    display: block;
    color: #fff;
    font-size: 11px;
}

#sub_business .imgbox .more:hover {
    background: #ec2b2b;
}

#sub_business .sub_business_imgbox_2 .imgbox .more {
    bottom: 0px;
}

#sub_business .descbox {
    margin-bottom: 100px;
}

#sub_business .descbox h4 {
    padding: 30px 0;
    text-align: center;
    font-weight: 600;
    font-size: 24px;
}

#sub_business .descbox ul.descbox_imglist {
    font-size: 0;
}

#sub_business .descbox ul.descbox_imglist li {
    display: inline-block;
    margin-right: 32.5px;
    vertical-align: top;
}

#sub_business .descbox ul.descbox_imglist li:last-child {
    margin-right: 0;
    float: right;
}

#sub_business .descbox ul.descbox_imglist li img {
    width: 100%;
}

#sub_business .descbox ul.descbox_imglist li p {
    font-weight: 500;
    margin-top: 20px;
    font-size: 18px;
}

#sub_business .descbox ul.descbox_list {
    border-top: 2px solid #b4b4b4;
    margin-bottom: 50px;
}

#sub_business .descbox ul.descbox_list li {
    height: 68px;
    text-align: center;
    border-bottom: 2px solid #ebebeb;
    display: flex;
    align-items: center;
}

#sub_business .descbox ul.descbox_list li:last-child {
    border-color: #b4b4b4;
}

#sub_business.sub_video .descbox ul.descbox_list li {
    text-align: left;
}

#sub_business .descbox ul.descbox_list li .eng {
    display: inline-block;
    min-width: 160px;
    color: #bf2525;
    font-weight: 700;
    box-sizing: border-box;
    padding-left: 20px;
}

#sub_business .descbox p {
    font-weight: 400;
    text-align: center;
    font-size: 18px;
    margin-bottom: 30px;
}

#sub_business .descbox p span {
    color: #6b6b6b;
}

#sub_business .descbox .redbox {
    margin-top: 30px;
    width: 100%;
    padding: 25px 0;
    text-align: center;
    border: 1px solid #bf2525;
    box-sizing: border-box;
}

#sub_business .descbox_1 .procedure {
    background: url("../images/common/sub_business1_descbox1_list.png") no-repeat top center;
    height: 101px;
}

#sub_business.sub_video .descbox li.graybox {
    display: inline-block;
    border-top: 2px solid #b4b4b4;
    border-bottom: 2px solid #b4b4b4;
    border-left: 1px solid #d7d7d7;
    border-right: 1px solid #d7d7d7;
    vertical-align: top;
}

#sub_business.sub_video .descbox li.graybox:last-child {
    margin-right: 0 !important;
}

#sub_business.sub_video .descbox_2 ul {
    font-size: 0;
}

#sub_business.sub_video .descbox_2 ul li.graybox {
    width: 18%;
    height: 145px;
    margin-right: 2.1%;
}

#sub_business.sub_video .descbox_2 ul li.graybox p {
    font-size: 14px;
    font-weight: 500;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}

#sub_business.sub_video .descbox_2 ul li ul {
    margin-top: 5px;
}

#sub_business.sub_video .descbox_2 ul li ul li {
    font-size: 13px;
    padding: 0 15px;
    position: relative;
    line-height: 1.5;
}

#sub_business.sub_video .descbox_2 ul li ul li::before {
    content: '-';
    position: absolute;
    left: 7px;
    top: -1px;
}

#sub_business .descbox_3 .procedure {
    background: url("../images/common/sub_business1_descbox3_list.png") no-repeat top center;
    height: 101px;
}

#sub_business.sub_video ul li.graybox2 {
    width: 30%;
    height: 225px;
    margin-right: 4%;
}

#sub_business.sub_video ul li.graybox2 p {
    letter-spacing: -1px;
    font-size: 16px;
    height: 60px;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
}

#sub_business.sub_video ul li.graybox2 li {
    padding: 0 15px;
    font-size: 14px;
}

#sub_business.sub_video .descbox_5 ul li.graybox2 {
    height: 135px;
}

#sub_business.sub_video .descbox .redbox span {
    font-weight: 500;
}

#sub_business.sub_video .descbox .redbox ul {
    margin-top: 10px;
    text-align: left;
    padding-left: 80px;
}

#sub_business.sub_video .descbox .redbox ul li {
    line-height: 1.5;
}

#sub_business .descbox_4 ul.descbox_imglist li {
    width: 33.3%;
    text-align: center;
    margin: 0;
}

#sub_business .descbox_4 ul.descbox_imglist li img {
    width: auto;
    height: 100%;
}

#sub_business.sub_video .descbox_4 .procedure {
    background: url("../images/common/sub_business2_procedure.jpg") no-repeat top center;
    height: 101px;
}

/* subpage product */
#sub_banner.product {
    background-image: url("../images/common/sub_product_banner.jpg");
}

#sub_product .product_title_box {
    margin: 150px 0 0;
    text-align: center;
}

#sub_product .product_title_box h3 {
    font-size: 36px;
}

#sub_product .product_title_box p {
    margin: 20px 0 50px;
}

#sub_product .product_list {
    border: 2px solid #6b6b6b;
    border-right: 0;
    border-left: 0;
    margin-bottom: 100px;
}

#sub_product .product_list ul li {
    position: relative;
    border-bottom: 1px solid #b4b4b4;
    padding: 20px 20px 15px;
    cursor: pointer;
    background-color: #fff;
}

#sub_product .product_list ul li:last-child {
    border-bottom: 0;
}

#sub_product .product_list ul li h4 {
    display: inline-block;
    font-size: 28px;
    font-weight: 600;
    position: relative;
    margin-bottom: 10px;
}

#sub_product .product_list ul li h4::after {
    content: '';
    position: absolute;
    top: 9px;
    right: -30px;
    display: block;
    width: 18px;
    height: 22px;
    background-image: url("../images/common/icon_arrow_red.png");
}

#sub_product .product_list ul li p.desc {
    display: block;
    color: #6d6d6d;
    font-size: 13px;
}

#sub_product .product_list ul li p.more {
    display: none;
    color: #fff;
    font-size: 13px;
}

#sub_product .product_list ul li .certification {
    position: absolute;
    top: 0;
    right: 30px;
}

/* product list hover */
#sub_product .product_list ul li:hover {
    background: #e44848;
    color: #fff;
}

#sub_product .product_list ul li:hover p.desc {
    display: none;
}

#sub_product .product_list ul li:hover p.more {
    display: block;
}

#sub_product .product_list ul li:hover h4::after {
    background-image: url("../images/common/icon_arrow_white.png");
}

#sub_product .product_list ul li:hover .certification {
    display: none;
}

/* product popup */
#product_popup {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    backdrop-filter: blur(2px);
    display: none;
}

#product_popup .back {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
}

#product_popup .wrapper {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#product_popup .wrapper .content {
    background: #fff;
    width: 70vw;
    max-height: 80vh;
    overflow-y: scroll;
    overflow-x: hidden;
}

#product_popup .wrapper .content .box {
    display: none;
}

#product_popup .wrapper .content .box img {
    width: 100%;
}

#product_popup .close {
    position: fixed;
    top: 0;
    right: 15px;
    color: #fff;
    padding: 3px 11px 7px;
    cursor: pointer;
    background: #ff3535;
}

#product_popup .content .popup-video-box {
    display: block;
    width: 60vw;
    margin: 0 auto;
    margin-bottom: 100px;
}

#product_popup .content .popup-video-box iframe {
    width: 100%;
    height: 33.8vw;
}


/* subpage prize */
#sub_banner.prize {
    background-image: url("../images/common/sub_prize_banner.jpg");
}

#sub_prize {
    margin: 150px 0 150px;
}

#sub_prize h3 {
    font-size: 36px;
    font-weight: 700;
    text-align: center;
}

#sub_prize .box {
    margin-top: 100px;
}

#sub_prize .box h4 {
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 50px;
}

#sub_prize .box h4.short_margin {
    margin-bottom: 10px;
}

#sub_prize .box h4.short_margin+p {
    font-weight: 500;
    margin-bottom: 50px;
    color: #555;
}

#sub_prize .box .prize_descbox>img {
    display: block;
    float: left;
    margin: 0 20px 40px 0;
    width: 40%;
    position: relative;
    z-index: 1;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1),
        0px 1px 6px rgba(0, 0, 0, 0.2),
        1px 2px 3px rgba(0, 0, 0, 0.6);
}

#sub_prize .box .desc {
    position: relative;
}

#sub_prize .box .desc p {
    height: 70px;
    line-height: 70px;
    border-bottom: 1px solid #a7a7a7;
    color: #555555;
    font-size: 24px;
    box-sizing: border-box;
    font-weight: 500;
}

#sub_prize .box .prize_descbox .link {
    position: absolute;
    top: 6px;
    right: 0;
}

#sub_prize .box .prize_descbox .link img {
    width: 50px;
}

#sub_prize .box .desc span {
    display: block;
    color: #888888;
    margin-top: 20px;
    font-size: 18px;
    line-height: 1.5;
}

#sub_prize .box .prize_descbox:nth-of-type(2n) img {
    float: right;
    margin: 0 0 40px 20px;
}

#sub_prize .box .prize_descbox:nth-of-type(2n) .desc {
    text-align: right;
}

#sub_prize .prize_title_box h3 {
    margin-top: 150px;
}

#sub_prize .prize_title_box p {
    margin: 20px 0 50px;
    text-align: center;
    font-size: 18px;
}

#sub_prize .patent_box {
    position: relative;
}

#sub_prize .count_box {
    width: 800px;
    height: 350px;
    background: url("../images/common/patent_bg.jpg") no-repeat bottom center;
    margin: 0 auto;
    position: relative;
    margin-bottom: 50px;
}

#sub_prize .count_box>div {
    width: 100px;
    height: 110px;
    text-align: center;
    position: absolute;
}

#sub_prize .count_box>div .patent_num {
    font-size: 80px;
    color: #ab0400;
    display: block;
    width: 100%;
    font-weight: bold;
}

#sub_prize .count_box>div .patent_text {
    font-size: 20px;
    color: #2a2a2b;
    width: 100%;
}

#sub_prize .count_box .domestic_box {
    top: 10px;
    left: 160px;
}

#sub_prize .count_box .overseas_box {
    top: 10px;
    right: 160px;
}

#sub_prize .count_box ul {
    font-size: 0;
    position: absolute;
    top: 230px;
    left: 0px;
}

#sub_prize .count_box ul li {
    display: inline-block;
    width: 100px;
    text-align: center;
    margin-right: 16px;
}

#sub_prize .count_box ul li:last-child {
    margin-right: 0;
    float: right;
}

#sub_prize .count_box ul li .small_num {
    font-size: 55px;
    color: #bb7272;
    font-weight: bold;
    display: block;
}

#sub_prize .count_box ul li .small_text {
    font-size: 18px;
    color: #2a2a2b;
    font-weight: 300;
}

#sub_prize .prize_slidebox {
    width: 100%;
    height: 500px;
    position: relative;
}

#sub_prize .prize_slidebox .swiper-container {
    width: 100%;
    height: 100%;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.7);
}

#sub_prize .prize_slidebox .swiper-pagination {
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
}

#sub_prize .prize_slidebox img {
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#sub_prize .prize_slidebox .swiper-container .swiper-slide-active {
    z-index: 9999;
}

#sub_prize .swiper-button-prev::after,
.swiper-button-next::after {
    transform: scale(0.6);
}

#sub_prize .swiper-pagination-bullet {
    background: #fff;
    opacity: .8;
    margin: 0 10px;
    width: 10px;
    height: 10px;
}

#sub_prize .swiper-pagination-bullet-active {
    background: #000;
    opacity: 1;
}

#sub_prize .swiper-container {
    width: 100%;
    height: 400px;
}

#sub_prize .swiper-container.patent1 {
    padding-top: 100px;
}

#sub_prize .swiper-container.patent1 .swiper-slide {
    width: 200px;
    height: 280px;
    background-size: cover;
    border: 1px solid rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
    position: relative;
    transform: scale(1);
    transition: transform .3s;
}

#sub_prize .swiper-container.patent1 .swiper-slide::after {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

#sub_prize .swiper-container.patent1 .swiper-slide-active {
    transform: scale(1.3);
    z-index: 9999;
}

#sub_prize .swiper-container.patent1 .swiper-slide-prev,
#sub_prize .swiper-container.patent1 .swiper-slide-next {
    transform: scale(1.05);
}

#sub_prize .swiper-container.patent1 .swiper-slide-active::after {
    background: transparent;
}

#sub_prize .swiper-container.patent1 .swiper-pagination-progressbar {
    top: auto;
    bottom: 50px;
}

#sub_prize .swiper-container.patent2 {
    padding-bottom: 50px;
}

#sub_prize .swiper-container.patent2 .swiper-pagination-progressbar {
    top: auto;
    bottom: 0;
}

#sub_prize .swiper-container.patent2 .swiper-slide {
    width: 283px;
    background-size: cover;
    border: 1px solid rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
}

/* swiper */
#sub_prize .swiper-button-next,
#sub_prize .swiper-button-prev {
    font-weight: 900;
    color: #042859;
}

#sub_prize .swiper-button-prev {
    left: -40px;
}

#sub_prize .swiper-button-next {
    right: -40px;
}

#sub_prize .patent_box .swiper-slide {
    cursor: grab;
}

#sub_prize .patent_box .swiper-slide-active {
    cursor: pointer;
}

.show_patent_image {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}

.patent_img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 70vh;
    display: inline-block;
}

.patent_img img {
    height: 100%;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
}

.patent_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
}


/* subpage notice */
#sub_banner.community {
    background-image: url("../images/common/sub_community_banner.jpg");
}

#sub_notice .title {
    width: 100%;
    text-align: center;
    margin-top: 100px;
    margin-bottom: 50px;
}

#sub_notice .title h3 {
    display: inline;
    font-size: 36px;
    font-weight: 700;
    position: relative;
}

#sub_notice .table_box {
    width: 100%;
    min-height: 450px;
    margin-bottom: 100px;
}

#sub_notice .table_box .search_box {
    float: right;
    position: relative;
}

#sub_notice .table_box .search_box select {
    height: 29px;
    border: 0;
}

#sub_notice .table_box .search_box input[type="text"] {
    border: 0;
    border-bottom: 1px solid #b7b6b6;
    width: 260px;
    line-height: 26px;
    text-indent: 5px;
}

#sub_notice .table_box .search_box input[type="submit"] {
    background: url("../images/common/search_icon.png") no-repeat center;
    border: 0;
    width: 35px;
    height: 29px;
    position: absolute;
    top: 50%;
    right: 0px;
    transform: translateY(-50%);
    cursor: pointer;
}

#sub_notice .table_box table {
    width: 100%;
    margin-top: 20px;
    border-top: 3px solid #2d2d2d;
}

#sub_notice .table_box table tr td {
    border-bottom: 1px solid #c1c1c1;
    height: 65px;
    vertical-align: middle;
}

#sub_notice .table_box table tr td.tbl_num {
    text-align: center;
    width: 10%;
}

#sub_notice .table_box table tr td.tbl_title {
    width: 70%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#sub_notice .table_box table tr td.tbl_title a:hover {
    text-decoration: underline;
}

#sub_notice .table_box table tr td.tbl_title .date {
    color: #706f6f;
    font-size: 12px;
}

#sub_notice .table_box table tr td.tbl_count {
    text-align: center;
    min-width: 70px;
    width: 0%;
}

#sub_notice .board_num {
    text-align: center;
    margin-top: 80px;
}

#sub_notice .board_num ul {
    font-size: 0;
    display: inline-block;
}

#sub_notice .board_num ul li {
    font-size: 16px;
    display: inline-block;
    padding: 0 5px;
}

#sub_notice .board_num .box li {
    border: 1px solid #000;
    width: 20px;
    height: 20px;
    padding: 0;
}

#sub_notice .board_num .box li a {
    display: block;
}

#sub_notice .board_num .box li img {
    vertical-align: 2px;
}

#sub_notice .board_num .prev ul li {
    margin-left: 10px;
}

#sub_notice .board_num .next ul li {
    margin-right: 10px;
}

#sub_notice .board_list .active {
    color: #ed2224;
}

#sub_notice .board_list li {
    vertical-align: 0;
}

#sub_notice .board_list li a {
    display: block;
    padding: 0 10px;
}

#sub_notice .board_list li a:hover {
    text-decoration: underline;
}

#sub_notice .tbl_consult {
    width: 100%;
    border-top: 3px solid #2d2d2d;
}

#sub_notice .tbl_consult td {
    height: 70px;
    border-bottom: 1px solid #2d2d2d;
    padding: 15px 0;
    box-sizing: border-box;
    text-align: left;
    font-size: 16px;
    font-weight: 700;
}

#sub_notice .tbl_consult td:nth-child(2n-1) {
    padding-left: 27px;
    background: url("../images/common/icon/consulting_icon.png") no-repeat left 10px center;
}

#sub_notice .tbl_consult td:nth-child(2n) {
    padding: 0 15px;
}

#sub_notice .tbl_consult td textarea {
    margin: 15px 0;
    border: 1px solid #c9c8c9;
    border-radius: 5px;
    box-sizing: border-box;
    padding: 10px;
}

#sub_notice .tbl_consult td.consult_tel div,
#sub_notice .tbl_consult td.consult_email div {
    display: flex;
    width: 100%;
    align-items: center;
}

#sub_notice .tbl_consult td input[type="text"] {
    width: 100%;
    border: 1px solid #c9c8c9;
    height: 40px;
    border-radius: 5px;
    margin: 0 10px;
    text-indent: 10px;
    font-size: 16px;
}

#sub_notice .tbl_consult td input[type="text"]:only-child {
    margin: 0;
}

#sub_notice .tbl_consult td input[type="text"]:first-child {
    margin-left: 0;
}

#sub_notice .tbl_consult td input[type="text"]:last-child {
    margin-right: 0;
}

#sub_notice .tbl_consult td select {
    border: 1px solid #c9c8c9;
    height: 44px;
    border-radius: 5px;
    padding: 0 5px;
    box-sizing: border-box;
    font-size: 14px;
}

#sub_notice .consult_info_check {
    padding: 15px;
    box-sizing: border-box;
    position: relative;
}

#sub_notice .consult_info_check .check_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#sub_notice .consult_info_check .check_box #consult_check {
    vertical-align: middle;
}

#sub_notice .consult_info_check .detail_docs {
    border: 1px solid #c9c8c9;
    margin-top: 15px;
}

#sub_notice .consult_info_check .detail_docs div {
    overflow-y: scroll;
    min-height: 150px;
    height: 200px;
    box-sizing: border-box;
    padding: 15px;
    font-size: 14px;
    color: #111;
    font-weight: 300;
}

#sub_notice .consult_submit {
    margin: 20px 0 40px;
}

#sub_notice .consult_submit input[type="button"] {
    padding: 12px 30px;
    color: #fff;
    font-size: 14px;
    background: #a71e22;
    border: 0;
    cursor: pointer;
}

#notice-layer-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    justify-content: center;
    align-items: center;
    display: none;
}

#notice-layer-popup.img_show {
    display: flex;
}

#notice-layer-popup .popup-image {
    z-index: 1;
}

#notice-layer-popup .popup-image img {
    max-height: 80vh;
    z-index: 9;
}

#notice-layer-popup .popup-bg {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    left: 0;
}

#sub_community_read h3 {
    text-align: center;
    font-size: 30px;
    margin-top: 100px;
}

#sub_community_read .tbl_read {
    border-top: 3px solid #000;
    border-bottom: 2px solid #000;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    height: 300px;
    margin: 50px auto 100px;
}

#sub_community_read .tbl_read td {
    border-right: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    height: 50px;
    max-height: 300px;
    text-align: center;
    padding: 0 10px;
}

#sub_community_read .tbl_read td:last-child {
    border-right: 0;
    text-align: left;
    overflow-y: auto;
}

#sub_community_read .tbl_read tr:last-child td {
    height: 300px;
    padding: 10px;
}




/* 최상단으로 이동 */
.topBtn {
    position: fixed;
    bottom: 60px;
    right: 100px;
    width: 57px;
    height: 57px;
    border: 1px solid #768397;
    border-radius: 5px;
    background: url("../images/common/icon/gotop.png") no-repeat center #fff;
    opacity: 0;
    transition: opacity .5s;
}

.topBtn a {
    display: block;
    width: 100%;
    height: 100%;
}

/* common css */
.clearfix::after {
    content: '';
    display: block;
    clear: both;
}

/* text hidden */
.hidden_block {
    overflow: hidden;
    border: 0;
    margin: -1px;
    width: 1px;
    height: 1px;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
}

.hidden_inline {
    overflow: hidden;
    display: inline-block;
    border: 0;
    margin: -1px;
    width: 1px;
    height: 1px;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
}




/* 1600px 해상도 */
@media screen and (max-width: 1610px) {

    /* common section */
    .text_box {
        font-size: 14px;
    }

    /* section social */
    #social .img_box:nth-child(2) {
        top: 4vh;
        right: 0;
    }

    #social .img_box:last-child {
        top: 25vh;
        right: 20vw;
    }

    #social .text_box {
        background-size: 450px;
    }

    /* section videoManage */
    #videoManage {
        background-image: url("../images/common/main/bg/section2_line_1600.png");
    }

    #videoManage .icon {
        width: 350px;
        height: 350px;
        margin: 230px 0 0 -500px
    }

    #videoManage .img_box {
        top: 17vh;
        right: 12vw;
    }

    #videoManage .text_box {
        background-size: 450px;
        background-position: 6.5em 0.5em;
        padding: 5.5em 0 0 10em
    }

    /* section disaster */
    #disaster .img_box:nth-child(2) {
        top: 4vh;
        right: 0;
    }

    #disaster .img_box:last-child {
        top: 25vh;
        right: 16vw;
    }

    #disaster .text_box {
        background-size: 530px;
    }

    /* section environment */
    #environment .img_box {
        top: 15vh;
        right: 9vw;
    }

    #environment .text_box {
        background-size: 480px;
    }

    /* section shortcut */
    #shortcut .shortcut_box {
        width: 900px;
    }

    /* subpage device popup */
    #sub_device_focus .popup {
        width: 1280px;
    }
}

/* 1366px 해상도 */
@media screen and (max-width: 1376px) {

    /* common section */
    .text_box {
        font-size: 12px;
    }

    /* section social */
    #social .img_box:nth-child(2) {
        top: 4vh;
        right: 2vw;
    }

    #social .img_box:last-child {
        top: 25vh;
        right: 23vw;
    }

    #social .text_box {
        background-size: 370px;
    }

    /* section videoManage */
    #videoManage {
        background-image: url("../images/common/main/bg/section2_line_1376.png");
    }

    #videoManage .icon {
        width: 280px;
        height: 280px;
        margin: 180px 0 0 -420px;
    }

    #videoManage .img_box {
        top: 17vh;
        right: 12vw;
    }

    #videoManage .text_box {
        background-size: 390px;
        margin-top: -0px;
        background-position: 6em 1em;
    }

    /* section disaster */
    #disaster .img_box:nth-child(2) {
        top: 4vh;
        right: 2vw;
    }

    #disaster .img_box:last-child {
        top: 27vh;
        right: 23%;
    }

    #disaster .text_box {
        background-size: 460px;
    }

    /* section environment */
    #environment .img_box {
        top: 15vh;
        right: 9vw;
    }

    #environment .text_box {
        background-size: 400px;
    }

    /* section shortcut */
    #shortcut .shortcut_box {
        width: 750px;
    }

    /* csr	 */
    #csr p {
        bottom: 34%;
        font-size: 20px;
    }

    /* footer */
    #footer .ft_wrap {
        padding: 0 20px;
        box-sizing: border-box;
    }

    /* subpage device popup */
    #sub_device_focus .popup {
        width: 800px;
        height: 520px;
    }
}


/* 1280px 해상도 */
@media screen and (max-width: 1290px) {

    /* common section */
    .text_box {
        font-size: 12px;
    }

    /* section social */
    #social .img_box:nth-child(2) {
        top: 4vh;
        right: 2vw;
    }

    #social .img_box:last-child {
        top: 25vh;
        right: 23vw;
    }

    #social .text_box {
        background-size: 370px;
    }

    /* section videoManage */
    #videoManage {
        background-image: url("../images/common/main/bg/section2_line_1280.png");
    }

    #videoManage .icon {
        width: 280px;
        height: 280px;
        margin: 180px 0 0 -420px;
    }

    #videoManage .img_box {
        top: 17vh;
        right: 12vw;
    }

    #videoManage .text_box {
        background-size: 390px;
        margin-top: -0px;
        background-position: 6em 1em;
    }

    /* section disaster */
    #disaster .img_box:nth-child(2) {
        top: 4vh;
        right: 2vw;
    }

    #disaster .img_box:last-child {
        top: 25vh;
        right: 23%;
    }

    #disaster .text_box {
        background-size: 460px;
    }

    /* section environment */
    #environment .img_box {
        top: 15vh;
        right: 9vw;
    }

    #environment .text_box {
        background-size: 400px;
    }

    /* section shortcut */

    /* csr	 */
    #csr p {
        bottom: 34%;
        font-size: 20px;
    }

    #shortcut .shortcut_box {
        width: 680px;
    }

    /* footer */
    #footer .ft_wrap {
        padding: 0 20px;
        box-sizing: border-box;
    }
}


/* 1200px 이하 해상도 모바일, 태블릿 */
@media screen and (max-width: 1199px) {
    body.on {
        width: 100%;
        height: 100vh;
        overflow: hidden;
    }

    #header {
        background-color: transparent;
        background-image: none !important;
        z-index: 2;
        transition-property: height;
        transition-duration: 0s;
        height: 80px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    }

    #header .logo {
        left: 0px;
        height: 80px;
        width: 100%;
        background: #fff;
        z-index: -1;
    }

    .mainHTML #header {
        box-shadow: none;
    }

    .mainHTML #header:hover,
    .mainHTML #header .logo {
        background: transparent;
    }

    #header .logo a {
        height: 80px;
        position: relative;
        float: left;
        z-index: 1;
    }

    #header .logo object {
        height: 100%;
        margin-top: 0px;
    }

    #header .mobilebox {
        width: 90vw;
        height: 100vh;
        background: #fff url("../images/svg/logo.svg") no-repeat top 0px left 0px;
        background-size: 180px;
        transform: translateX(110vw);
        z-index: 1000;
        padding-top: 90px;
        box-shadow: -1px 0 3px rgba(0, 0, 0, 0.3);
    }

    #header::before {
        display: none;
    }

    #header .hamburger {
        position: absolute;
        top: 0;
        right: 0;
        width: 80px;
        height: 80px;
        display: block;
        cursor: pointer;
    }

    #header .hamburger span {
        display: block;
        width: 32px;
        height: 4px;
        border-radius: 3px;
        background: #000;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
        transition: background .5s;
    }

    #header .hamburger.white span {
        background: #fff;
    }

    #header .hamburger span::before {
        content: '';
        display: block;
        position: absolute;
        top: -10px;
        left: 0;
        width: 100%;
        height: 100%;
        background: inherit;
        border-radius: inherit;
        transition: transform .5s;
    }

    #header .hamburger span::after {
        content: '';
        display: block;
        position: absolute;
        top: 10px;
        left: 0;
        width: 100%;
        height: 100%;
        background: inherit;
        border-radius: inherit;
        transition: transform .5s;
    }

    body.on #header .hamburger span {
        background: transparent;
    }

    body.on #header .hamburger span::before {
        transform: translate(0px, 10px) rotate(45deg);
        background: #000;
    }

    body.on #header .hamburger span::after {
        transform: translate(0px, -10px) rotate(-45deg);
        background: #000;
    }

    #header .bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.6);
        z-index: -1;
    }

    #header .gnb {
        border-top: 1px solid rgb(78, 78, 78);
        padding-top: 20px;
    }

    #header .gnb>li {
        display: block;
        text-align: left;
        height: auto;
        line-height: 50px;
        margin-bottom: 10px;
        width: 100%;
    }

    #header .gnb>li>a {
        padding: 0 0 0 30px;
        background: url("../images/common/icon/mobileSlideDown.png") no-repeat top 16px left 115px;
        background-size: 20px;
    }

    #header .gnb li a:hover {
        text-decoration: none;
    }

    #header .gnb .lnb {
        position: relative;
        top: 0px;
        height: auto;
        overflow: hidden;
        padding: 10px 0 10px 30px;
        background: #f1f1f1;
        display: none;
    }

    #header .gnb .lnb li {
        padding: 0;
        font-weight: 500;
    }

    #header .gnb .lnb li .lnb_line::before {
        left: -5px;
        width: 107px;
    }

    #header .lang_btn {
        display: none;
    }

    #sub_banner {
        margin-top: 80px;
        height: 300px;
    }

    #sub_banner h2 {
        font-size: 50px;
    }

    #sub_nav #sub-navigation {
        position: absolute;
        top: -6px;
        left: 0;
        display: inline-block;
        width: 185px;
        height: 30px;
        background: #fff;
        color: #000;
        font-size: 16px;
        border: 0;
        border-bottom: 1px solid #333;
    }

    #sub_nav .sub_navlist {
        position: relative;
        top: auto;
        left: auto;
        max-width: 100%;
        width: 960px;
        margin: 0 auto;
        text-align: center;
    }

    #sub_nav .sub_navlist ul {
        text-align: center;
        display: none;
    }

    #sub_nav .sub_navlist ul li {
        display: inline-block;
    }

    #sub_nav .sub_navlist ul li a {
        padding: 0 10px;
        text-align: center;
    }

    #sub_nav .sub_navlist ul li a::after {
        bottom: 0;
        left: 0;
    }

    #sub_nav .sub_navlist ul li a.active::after,
    #sub_nav .sub_navlist ul li a:hover::after {
        width: 100%;
    }

    @keyframes subNavShow {
        0% {
            width: 0;
        }

        100% {
            width: 100%;
        }
    }

    #sub_intro .intro .youtube img {
        background-image: url("../images/common/icon/youtube_icon_bg.png");
    }

    #sub_intro .intro .youtube:hover img,
    #sub_intro .intro .youtube:focus img {
        background: auto;
    }

    #footer {
        height: auto;
    }

    #footer .ft_wrap {
        padding: 30px 20px;
        box-sizing: border-box;
        height: auto;
    }

    #footer .ft_bt .ft_logo {
        width: 100%;
        display: block;
    }

    #footer .ft_bt p {
        margin-left: 0px;
        width: 100%;
    }

    #footer .ft_bt .fax {
        float: left;
        margin: 20px 0;
    }

    #footer .ft_bt .fax .phone {
        position: relative;
        margin-right: 20px;
    }

    #footer .ft_bt .fax .phone::before {
        content: '';
        position: absolute;
        display: block;
        top: 4px;
        right: -8px;
        width: 2px;
        height: 18px;
        background: #fff;
    }

    .color_bar,
    .topBtn {
        display: none;
    }
}


/* 1000px 이하 해상도 모바일, 태블릿 */
@media screen and (max-width: 999px) {
    .mainHTML #main.section {
        height: 100vh;
    }

    .mainHTML .section {
        background-size: 1000px;
        height: 750px;
        margin-bottom: 50px;
    }

    .mainHTML .section .text_box {
        opacity: 1;
        background-image: none !important;
        position: absolute;
        bottom: 360px;
        left: 0;
        padding: 0;
        margin: 0;
        width: 100%;
        height: auto;
        text-align: center;
    }

    .mainHTML .section .text_box h2 {
        font-size: 5em;
    }

    .mainHTML .section .text_box h3 {
        font-size: 3em;
    }

    .mainHTML .section .text_box p {
        font-size: 2.5em;
        margin-top: 10px;
    }

    .mainHTML .wrap {
        width: 100%;
    }

    #main {
        background: url("../images/common/mobile/mobile_banner_text.png") no-repeat center, url("../images/common/mobile/main_banner.png") no-repeat bottom center;
        background-size: 80vw auto, auto;
        height: 100vh;
    }

    #social {
        background-image: url('../images/common/mobile/main_social_bg.jpg');
        background-position: bottom;
        animation: none;
    }

    #sub_intro .intro img.pc {
        display: none;
    }

    #sub_intro .intro img.mobile {
        display: block;
        width: 60vw;
        margin: 100px auto 0;
    }

    #videoManage {
        background-image: url('../images/common/mobile/main_video_bg.jpg');
        background-position: bottom;
        background-size: 1000px;
    }

    #videoManage .text_box {
        margin: 0;
        padding: 0;
        width: 100%;
    }

    #disaster {
        background-image: url('../images/common/mobile/main_culture_bg.jpg');
        background-position: bottom;
    }

    #environment {
        background-image: url('../images/common/mobile/main_env_bg.jpg');
        background-position: bottom;
    }

    #csr {
        background-image: url('../images/common/mobile/main_csr_bg.jpg');
        background-position: bottom;
        text-align: center;
    }

    #csr object {
        display: none;
    }

    #csr p {
        display: block;
        bottom: 10%;
        left: 50%;
        transform: translateX(-50%);
        font-size: 20px;
        color: #fff;
        text-align: center;
        width: 100%;
    }

    #csr p::before {
        content: 'CSR';
        position: absolute;
        display: block;
        top: -120px;
        left: 50%;
        transform: translateX(-50%);
        font-size: 90px;
        font-weight: 500;
        color: #fff;
        letter-spacing: 1rem;
    }

    #shortcut {
        background-image: url('../images/common/mobile/main_shortcut_bg.jpg');
        background-position: bottom;
    }

    #shortcut .shortcut_box {
        max-width: 100%;
    }

    .shortcut_box .textbox {
        padding-left: 20px;
    }

    #shortcut .textbox h2 {
        text-align: left;
        padding-left: 20px;
    }

    .shortcut_box .textbox h2 b::before {
        content: '';
        display: block;
    }

    #shortcut .shortcut_box .card_box>a {
        display: block;
        width: 90%;
        height: 100px;
        margin: 0 auto;
    }

    #shortcut .shortcut_box .box .box_face {
        display: block;
    }

    #shortcut .shortcut_box .box .box_front {
        border: 0;
        border-bottom: 1px solid #9b9b9b;
    }

    #shortcut .shortcut_box .box .box_front img {
        position: absolute;
        left: 20px;
        top: 50%;
        transform: translateY(-50%);
        height: 60%;
    }

    #shortcut .shortcut_box .box .box_front span {
        position: absolute;
        right: 50px;
        bottom: calc(50% - 31.2px);
    }

    #shortcut .shortcut_box .box .box_front span::after {
        content: '';
        position: absolute;
        top: 6px;
        right: -49px;
        width: 13px;
        height: 24px;
        background: url("../images/common/mobile/next.jpg") no-repeat;
        background-size: cover;
    }

    #shortcut .shortcut_box .box .box_back {
        display: none;
    }

    #shortcut .shortcut_box .card_box>a:hover {
        z-index: auto;
    }

    #shortcut .shortcut_box .card_box>a:hover .box {
        transform: none;
    }

    .section #footer {
        bottom: -230px;
    }

    #sub_intro .intro img.logo {
        width: 120px;
        margin-right: 50px;
    }

    #sub_intro .intro .youtube img {
        width: 80px;
    }

    #sub_intro .intro .youtube::after {
        font-weight: 400;
        font-size: 12px;
        left: -30px;
    }

    #sub_nav .wrap_960 {
        padding-left: 20px;
    }

    #sub_organ .organ {
        margin-top: 100px;
    }

    #sub_organ .organ img {
        width: 90vw;
    }

    #sub_history {
        background-size: 90vw;
        margin-top: 100px;
    }

    #sub_history .history_nav {
        bottom: 0px;
        left: 10%;
    }

    #sub_map {
        margin-top: 100px;
    }

    #sub_map .map_box {
        width: 90vw;
        height: 80vw;
        max-width: 800px;
        max-height: 400px;
    }

    #sub_map .map ul {
        width: 90vw;
        margin: 0 auto;
    }

    #sub_map .map ul li {
        font-size: 14px;
    }

    #sub_map .map .guide_box {
        margin-right: 0px;
    }

    #product_popup .wrapper .content {
        width: 80vw;
        max-height: 90vh;
    }

    #sub_prize .wrap_800 {
        padding: 0 20px;
        box-sizing: border-box;
    }

    #sub_prize h3 {
        font-size: 50px;
    }

    #sub_prize .box {
        margin-top: 0;
    }

    #sub_prize .box .prize_descbox img {
        width: 100%;
        float: none;
        margin: 50px 0 0 0;
    }

    #sub_prize .box .prize_descbox:first-child img {
        margin-top: 100px;
    }

    #sub_prize .box h4 {
        font-size: 40px;
    }

    #sub_prize .box h4:first-child {
        margin-top: 100px;
    }

    #sub_prize .box h4.short_margin {
        margin-top: 100px;
    }

    #sub_prize .box .desc p {
        font-size: 30px;
        height: 80px;
        line-height: 80px;
    }

    #sub_prize .box .desc span {
        font-size: 20px;
        margin-bottom: 50px;
    }

    #sub_prize .box .prize_descbox:nth-of-type(2n) img {
        float: none;
        margin: 50px 0 0 0;
    }

    #sub_prize .box .prize_descbox:nth-of-type(2n) .desc {
        text-align: left;
    }

    #sub_prize .box .prize_descbox .link {
        top: 3px;
    }

    #sub_prize .box .prize_descbox .link img {
        margin: 0;
    }

    #sub_prize .prize_slidebox {
        width: 80%;
        margin: 0 auto;
    }

    #sub_prize .patent_box {
        width: 80%;
        margin: 0 auto;
    }

    #sub_notice .wrap_960 {
        padding: 0 20px;
        box-sizing: border-box;
    }

    #sub_notice .consult_info_check .check_box div {
        position: absolute;
        bottom: -20px;
        left: 11px;
    }

    #main video,
    #videoManage .bg_img,
    #rotate-logo,
    #quickmenu,
    #sub_banner p,
    .section .img_box,
    .scrolldown_icon,
    .csr_bg {
        display: none !important;
    }
}

@media screen and (max-width: 700px) {
    .mainHTML .section .text_box h2 {
        font-size: 2.5em;
    }

    .mainHTML .section .text_box h3 {
        font-size: 2em;
    }

    .mainHTML .section .text_box p {
        font-size: 1.8em;
        margin-top: 10px;
    }

    #sub_intro .intro img.logo {
        margin-right: 20px;
    }

    #sub_intro .intro img.mobile {
        width: 70vw;
    }

    #sub_business .wrap_800 {
        padding: 0 20px;
        box-sizing: border-box;
    }

    #sub_business .sub_business_imgbox_1 .imgbox {
        width: 100%;
        height: auto;
        margin-bottom: 80px;
    }

    #sub_business .sub_business_imgbox_1 .imgbox img {
        width: 70%;
        height: auto;
        margin: 0 auto;
    }

    #sub_business .sub_business_imgbox_1 .imgbox .box_text {
        position: relative;
    }

    #sub_business .sub_business_imgbox_1 .imgbox ul {
        text-align: center;
        margin-bottom: 100px;
    }

    #sub_business .sub_business_imgbox_1 .imgbox .more {
        right: 15%;
        bottom: -60px;
    }

    #sub_business .sub_business_imgbox_2 .imgbox {
        width: 100%;
        height: auto;
        text-align: center;
        margin-bottom: 50px;
    }

    #sub_business .sub_business_imgbox_2 .imgbox .box_text {
        position: relative;
    }

    #sub_business .sub_business_imgbox_2 .imgbox img {
        width: 70%;
        height: auto;
    }

    #sub_business .sub_business_imgbox_2 .imgbox ul {
        text-align: center;
        margin-bottom: 100px;
    }

    #sub_business .sub_business_imgbox_2 .imgbox .more {
        right: 15%;
        bottom: -70px;
    }

    #sub_business.sub_env .sub_business_imgbox_2 .imgbox .more {
        right: 15%;
        bottom: 50px;
    }

    #sub_business .sub_business_imgbox_2 {
        margin-bottom: 0;
    }

    #sub_business .sub_business_title p br {
        display: none !important;
    }

    #sub_business .descbox h4 {
        font-size: 18px;
    }

    #sub_business .descbox ul.descbox_list li .eng {
        min-width: 130px;
    }

    #sub_business.sub_video .descbox ul.descbox_list li {
        font-size: 14px;
    }

    #sub_business .descbox .redbox {
        padding: 20px;
    }

    #sub_business .descbox .redbox br {
        display: none !important;
    }

    #sub_business.sub_video .descbox_4 .procedure {
        background-size: 90vw;
    }

    #sub_business.sub_video .descbox .redbox ul {
        padding-left: 0;
    }

    #sub_business.sub_video .descbox .redbox ul li {
        font-size: 15px;
    }

    #sub_business .descbox ul.descbox_imglist li {
        display: block;
        margin: 0 auto 100px;
        width: 70%;
    }

    #sub_business .descbox ul.descbox_imglist li:last-child {
        float: none;
    }

    #sub_business .descbox ul.descbox_imglist li p {
        margin-top: 5px;
    }

    #sub_business .descbox ul.descbox_imglist li img {
        display: block;
        margin: 0 auto;
    }

    #sub_business .descbox_1 .procedure {
        background-size: 90vw;
    }

    #sub_business.sub_prevention .descbox img {
        width: 90vw;
    }

    #sub_business .descbox_3 .procedure {
        background-size: 90vw;
        margin-top: 80px;
    }

    #sub_business .descbox ul.descbox_list li {
        font-size: 14px;
    }

    #sub_business .descbox ul.descbox_imglist {
        margin-top: 100px;
    }

    #sub_business .descbox ul.descbox_imglist li:last-child {
        margin-right: auto;
    }

    #sub_business.sub_video .descbox.descbox_5 li.graybox {
        width: 60%;
        height: auto;
    }

    #sub_business.sub_video .descbox.descbox_5 ul {
        text-align: center;
    }

    #sub_business.sub_video .descbox li.graybox {
        width: 100%;
        height: auto;
        padding: 10px 0 20px;
        margin: 0 auto 30px;
    }

    #sub_business.sub_video ul li.graybox2 p {
        padding-bottom: 20px;
    }

    #sub_business.sub_video .descbox_2 ul li.graybox {
        width: 47%;
        margin-right: 4%;
    }

    #sub_business.sub_video .descbox_2 ul li.graybox:nth-child(2n) {
        margin-right: 0;
    }

    #sub_business.sub_video .descbox_2 ul li ul li {
        padding: 0 20px;
    }

    #sub_prize .count_box {
        background: none;
        max-width: 100%;
    }

    #sub_prize .count_box ul li:last-child {
        float: none;
    }

    #sub_prize .count_box .domestic_box {
        left: 50%;
        transform: translateX(-150%)
    }

    #sub_prize .count_box .overseas_box {
        right: 50%;
        transform: translateX(150%)
    }

    #sub_prize .count_box ul {
        top: 160px;
        text-align: center;
    }

    #product_popup .wrapper .content {
        width: 90vw;
        max-height: 90vh;
    }

    #sub_product .wrap_800 {
        padding: 0 20px;
        box-sizing: border-box;
    }

    #sub_product .product_list ul li h4 {
        font-size: 22px;
        padding-right: 35px;
    }

    #sub_product .product_list ul li h4::after,
    #sub_product .product_list ul li:hover h4::after {
        background: none;
    }

    #sub_product .product_list ul li p.desc,
    #sub_product .product_list ul li p.more {
        font-size: 14px;
    }

    #sub_product .product_list ul li .certification {
        right: 10px;
    }

    #sub_product .product_list ul li:hover p.desc {
        display: block;
        color: #fff;
    }

    #sub_product .product_list ul li:hover p.more {
        display: none;
    }

    #sub_prize h3 {
        font-size: 36px;
    }

    #sub_prize .box h4 {
        font-size: 30px;
    }

    #sub_prize .box .desc p {
        font-size: 22px;
        height: 60px;
        line-height: 60px;
    }

    #sub_prize .box .desc span {
        font-size: 18px;
    }

    #sub_notice .count {
        display: block;
        margin: 20px 0;
    }

    #sub_notice .table_box .search_box {
        float: left;
        margin-bottom: 20px;
    }

    #sub_notice .table_box table tr td {
        height: 55px;
    }

    #sub_notice .table_box table tr td.tbl_num {
        display: none;
    }

    #sub_notice .table_box table tr td.tbl_title {
        max-width: 0;
        width: 80%;
        padding-right: 20px;
    }

    #sub_notice .table_box table tr td.tbl_title a,
    #sub_notice .table_box table tr td.tbl_count {
        font-size: 14px;
    }

    #sub_notice .board_num {
        margin-top: 50px;
    }

    #sub_notice .tbl_consult td {
        font-size: 14px;
        height: 55px;
    }

    #sub_notice .tbl_consult td:nth-child(2n) {
        padding: 0 10px;
    }

    #sub_notice .tbl_consult td input[type="text"] {
        height: 30px;
        margin: 0 5px;
    }

    #sub_notice .tbl_consult td select {
        height: 34px;
    }

    #sub_notice .tbl_consult td textarea {
        margin: 10px 0;
    }

    #sub_prize {
        margin: 100px 0;
    }

    #sub_prize .prize_slidebox {
        height: 60vw;
    }

    #sub_prize .swiper-pagination-bullet {
        margin: 0 5px;
        width: 8px;
        height: 8px;
    }

    #footer {
        font-size: 14px;
    }

    #footer .mobileBR {
        display: block;
    }
}

@media screen and (max-width: 450px) {
    #sub_intro .intro img.logo {
        width: 100px;
    }

    #sub_intro .intro .youtube img {
        width: 60px;
    }

    #sub_intro .intro .youtube::after {
        font-size: 10px;
        left: -43px;
    }

    #sub_intro .intro img.mobile {
        width: 90vw;
    }

    #sub_business .sub_business_title h3 {
        font-size: 24px;
    }

    #sub_business .sub_business_title p {
        font-size: 16px;
    }

    #sub_map {
        margin-top: 100px;
    }

    #sub_map .map_title {
        width: 80%;
        margin: 0 auto 100px;
    }

    #sub_prize .box .desc p {
        font-size: 16px;
        height: 50px;
        line-height: 50px;
    }

    #sub_prize .box .desc span {
        font-size: 13px;
    }

    #sub_nav .nav_now ul li img {
        vertical-align: -6px;
    }

    #sub_nav .nav_now ul li::before {
        top: 3px;
    }

    #sub_nav .nav_now {
        height: 40px;
    }

    #sub_nav .nav_now ul {
        padding-top: 10px;
    }

    #sub_nav .nav_now ul li,
    #sub_nav .sub_navlist ul li a {
        font-size: 14px;
    }

    #sub_nav #sub-navigation {
        font-size: 14px;
        top: -4px;
        height: 24px;
        width: 165px;
    }

    #sub_notice .tbl_consult td {
        height: 50px;
    }

    #sub_notice .tbl_consult td:nth-child(2n-1) {
        background: none;
        padding-left: 3px;
    }

    #sub_notice .tbl_consult td:nth-child(2n) {
        padding: 0;
        padding-right: 10px;
    }

    #sub_notice .tbl_consult td input[type="text"] {
        height: 25px;
        font-size: 14px;
        text-indent: 5px;
        margin: 0 2px;
    }

    #sub_notice .tbl_consult td select {
        height: 29px;
        font-size: 11px;
        padding: 0;
        padding-left: 5px;
        width: 60px;
    }

    #sub_notice .tbl_consult td.consult_email div {
        font-size: 14px;
    }

    #sub_notice .consult_info_check {
        font-size: 13px;
    }

    #sub_notice .consult_info_check .detail_docs div {
        height: 100px;
        font-size: 11px;
    }

    #sub_notice .consult_submit {
        margin-top: 32px;
    }
}