@charset "utf-8";

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    -webkit-text-size-adjust: 100%;
}

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}



html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
    justify-content: center;
    align-content: center;
    flex-wrap: nowrap;
    background-color: #fff;
    font-family: 'NanumGothic';
    overflow: auto;
}

body::-webkit-scrollbar {
    width: 10px;
}

body::-webkit-scrollbar-thumb {
    background: rgb(68, 176, 214);
    background: linear-gradient(0deg, rgba(68, 176, 214, 1) 0%, rgba(95, 159, 208, 1) 100%);
    border-radius: 20px;
}

body::-webkit-scrollbar-track {
    background: rgb(253, 255, 244);
    background: linear-gradient(0deg, rgba(253, 255, 244, 1) 0%, rgba(83, 99, 111, 1) 100%);
}

ol,
ul {
    list-style: none;
}

img {
    border: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* 서브페이지 공통 스타일 */
/* 공통스타일 시작 */
        .sub_main__visual {
            width: 100%;
            height: 675px;
            background-size: cover;
            background-image: url("../img/notice/bg.png");
            background-repeat: no-repeat;
            background-position: center center;
            background-attachment: fixed;
        }
        .sub_main_tit {
            width: 100%;
            height: 100%;
            display: flex;
            text-align: center;
            align-items: center;
            align-content: center;
            flex-wrap: wrap;
            justify-content: center;
            flex-direction: column;
        }
        .sub_main_tit h1 {
            text-align: center;
            width: 100%;
            max-width:1200px;
            color: #fff;
            font-size: 82px;
            font-family: 'NanumGothicExtraBold';
            letter-spacing: -3px;
            text-shadow: 1px 1px 12px #fff;
            transition-timing-function: ease;
            transform: translate3d(0,100px,0);
            opacity: 0;
            transition-duration: 1s;
            transition-delay: .3s;
            word-break: keep-all;
        }
        .sub_main_tit h1.on {
            opacity: 1;
            transform: translateZ(0);
        }
        .sub_main_tit span {
            display: block;
            width: 30px;
            height: 2px;
            background-color: #fff;
            margin: 25px auto;
            transition-timing-function: ease;
            transform: translate3d(0,100px,0);
            opacity: 0;
            transition-duration: 1s;
            transition-delay: 0.45s;
        }
        .sub_main_tit span.on {
            opacity: 1;
            transform: translateZ(0);
        }
        .sub_main_tit p {
            width: 100%;
            text-align: center;
            color: #fff;
            font-size: 17px;
            font-family: 'NanumGothic';
            margin-top: 10px;
            text-shadow: 1px 1px 8px #fff;
            transition-timing-function: ease;
            transform: translate3d(0,100px,0);
            opacity: 0;
            transition-duration: 1s;
            transition-delay: 0.55s;
            word-break: keep-all;

        }
        .sub_main_tit p.on {
            opacity: 1;
            transform: translateZ(0);
        }
        
        .sub_nav {
            position: relative;
            height: 91px;
            border-bottom: 2px solid #f2f2f2;
        }
        .sub_nav__box {
            position: relative;
            z-index: 1;
            height: 100%;
            width: 1200px;
            margin: 0 auto;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: center;
        }
        
        .sub_nav__box ul {
            display: flex;
            width: 400px;
        }
        .sub_nav__box ul li a {
            display: block;
            position: relative;
            margin: 31px;
            font-weight: 400;
            color: #444;
            text-align: left;
        }

        /* 공통스타일 끝 */
        @media (max-width:1200px ) {
            .sub_main__visual {
                height: 500px;
            }
        }

        @media (max-width:1260px ) {
            .sub_main_tit h1 {
                width: 100%;
                max-width: none;
            }
        }

        @media(max-width: 500px) {
            .sub_main_tit h1 {
                font-size: 15.102995vw;
                line-height: 1.2;
            }

            .sub_main_tit p {
                font-size: 4.079217vw;
            }

            .sub_main__visual {
                height: 430px;
            }

            .sub_main_tit {
                flex-direction: row;
            }
        }