@charset "utf-8";

/* common */
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, font, 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, dialog, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

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

ol, ul, li {
    list-style: none
}

blockquote, q {
    quotes: none
}

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

ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none;
}

del {
    text-decoration: line-through;
}

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

abbr[title], dfn[title] {
    border-bottom: 1px dotted #000;
    cursor: help
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #c7c7c7;
    margin: 1em 0;
    padding: 0;
}

* {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
}

img {
    display: block;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    border: 0 none;
}

.hidden {
    position: absolute;
    left: -9999px;
    top: -9999px;
    width: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
}

form {
    min-width: auto;
}

input[type="image"] {
    border: 0 none;
}

button, input[type="submit"] {
    cursor: pointer;
    border: 0 none;
}

button {
    background-color: transparent;
}

button::-moz-focus-inner {
    border: 0 none;
    padding: 0;
}

body {
    background-color: #ffffff;
    word-wrap: break-word;
    word-break: break-all;
    zoom: 1;
    -webkit-text-size-adjust: 100%;
}

body, html {
    position: relative;
    height: 100%;
}

body, th, td, input, select, textarea, button {
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    font-family: 'Noto Sans KR', 'Malgun Gothic', '맑은 고딕', sans-serif;
    color: #222;
}

/* color값은 디자인가이드에 맞게사용 */
a {
    display: block;
    font-family: 'Noto Sans KR', 'Malgun Gothic', '맑은 고딕', sans-serif;
    text-decoration: none;
    color: #222;
    transition: .3s;
}

a:hover {
    text-decoration: none;
}

/* color값은 디자인가이드에 맞게사용 */
/* */
.t_c {
    text-align: center !important;
}

.t_l {
    text-align: left !important;
}

.t_r {
    text-align: right !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}

.color_666 {
    color: #666 !important;
}

@media screen and (min-width: 1201px) {
    .pc_none {
        display: none !important;
    }
}

@media screen and (max-width: 1200px) {
    .pc_only {
        display: none !important;
    }
}

@media screen and (min-width: 768px) {
    .mb_only {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {
    .mb_none {
        display: none !important;
    }
}

.inner {
    margin: 0 auto;
    max-width: 1200px;
    padding: 0;
}

@media screen and (max-width:1200px) {
    .inner {
        width: 100%;
        padding: 0 20px;
        ;
    }
}

/* layer */
.layer {
    display: none;
    position: fixed;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

.layer .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .5;
    filter: alpha(opacity=50);
}

.layer .pop-layer {
    display: block;
}

.pop-layer {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 350px;
    height: auto;
    background-color: #fff;
    border: 3px solid #555;
    z-index: 10;
}

.pop-layer .pop-container {
    padding: 20px 25px;
}

input[type="text"], input[type="password"], textarea, input[type="submit"] {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
}

.pop-layer .board-password-txt {
    font-size: 13px;
    line-height: 18px;
    text-align: center;
}

.pop-layer .board-password-input {
    margin: 40px;
    text-align: center;
}

.pop-layer .board-password-input label {
    display: inline-block;
    margin: 0 10px 0 0;
    font-size: 12px;
    color: #333;
    vertical-align: middle;
}

.pop-layer .board-password-input input {
    display: inline-block;
    padding: 0 0 0 8px;
    width: 150px;
    height: 26px;
    border: 1px solid #d8d8d8;
    color: #555;
    vertical-align: middle;
}

/* btn */
.pop-layer .board-password-btn {
    text-align: center;
}

.pop-layer .board-password-btn a {
    display: inline-block;
    margin: 0 5px;
    padding: 10px 30px;
    box-sizing: border-box;
    text-decoration: none;
    font-size: 13px;
}

.pop-layer .board-password-btn .board-password-btn-list {
    background: #d3d3d3;
    color: #464646;
}

.pop-layer .board-password-btn .board-password-btn-ok {
    background: #111;
    color: #fff;
}

/* ---------------------------------- layout */
html, body {
    height: 100%;
}

#wrapeer {
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width:321px) {
    body {
        overflow-x: hidden;
    }
}

/*
	header
*/
#header {
    position: fixed;
    top: 0;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
    background: rgba(0, 0, 0, .2);
    z-index: 1000;
}

#header:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 0;
    background: rgba(0, 0, 0, .8);
    -webkit-transition: .2s all ease-in-out;
    -ms-transition: .2s all ease-in-out;
    transition: .2s all ease-in-out;
}

#header:hover:before,
#header.fixed:before {
    height: 100%;
}

#header .header-top {
    width: 100%;
    background-color: #f1f1f1;
}

#header .header-top dl {
    margin: 0 auto;
    width: 1200px;
    text-align: right;
    font-size: 0;
    line-height: 0;
}

#header .header-top dd {
    display: inline-block;
    width: 130px;
}

#header .header-top dd a {
    display: block;
    font-size: 13px;
    line-height: 30px;
    text-align: center;
    letter-spacing: 0.5px;
}

#header .header-top dd.lang a {
    background-color: #555555;
    color: #fff;
}

#header .header-bottom {
    margin: 0 auto;
    width: 1200px;
    display: flex;
    align-items: center;
}

#header .header-bottom:after {
    content: '';
    display: block;
    clear: both;
}

#header .logo {
    float: left;
    z-index: 1;
    font-size: 0;
}

#header .logo a {
    display: block;
    width: 100%;
}

@media screen and (max-width:1200px) {
    #header .header-top {
        display: none;
    }

    #header .header-bottom {
        padding: 0 30px;
        width: 100%;
        height: 80px;
    }

    #header .logo a {}

    #header .logo a img {
        width: auto;
        max-width: 100%;
    }
}

@media screen and (max-width:768px) {
    #header .header-bottom {
        padding: 0 20px;
        height: 55px;
    }

    #header .logo a {
        height: 30px;
    }

    #header .logo a img {
        height: 100%;
    }
}

/* web gnb */
#header .gnb {
    display: inline-block;
    width: calc(100% - 106px);
    vertical-align: top;
    text-align: center;
}

#header .w-lang {
    overflow: hidden;
    float: right;
    padding: 32px 0;
}

#header .w-lang dd {
    float: left;
    margin-left: 8px;
}

#header .w-lang dd a {
    position: relative;
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
}

html[lang="ko"] #header .w-lang dd.lang.ko a:after,
html[lang="en"] #header .w-lang dd.lang.en a:after,
html[lang="zh"] #header .w-lang dd.lang.zh a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #fff;
    left: 0;
    bottom: -3px;
}

#header .w-lang dd a img {
    border: 1px solid #cecece;
}

@media screen and (min-width:1201px) {
    #header {
        max-height: 84px;
    }

    #header .m-menu-btn,
    #header .m-gnb-bg,
    #header .m-lang {
        display: none;
    }

    /* 1depth */
    #header .gnb>ul {
        display: inline-block;
        vertical-align: top;
        font-size: 0;
        line-height: 0;
    }

    #header .gnb>ul>li {
        position: relative;
        display: inline-block;
        padding: 0 39px;
        vertical-align: top;
    }

    #header .gnb>ul>li>a {
        display: block;
        font-weight: 700;
        font-size: 18px;
        line-height: 84px;
        color: #fff;
    }

    /* #header .gnb > ul > li:hover > a {color:#003e7e;} */
    /* 2depth */
    #header .gnb .depth2 {
        display: none;
        position: absolute;
        top: 78px;
        left: 50%;
        z-index: 0;
        margin-left: -100px;
        width: 200px;
        height: 0;
        border-top: 5px solid #ed1c25;
        background: rgba(0, 0, 0, .7);
        text-align: center;
        transition: .3s;
        opacity: 0;
    }

    #header .gnb .depth2 li {
        position: relative;
        transition: .3s;
        border-top: 1px solid rgba(51, 51, 51, .7);
    }

    /* #header .gnb > ul > li:last-child .depth2 {left:0; width:calc(100% + 30px);}
	#header .gnb > ul > li:nth-child(3) .depth2 {width:calc(100% + 20px);} */
    #header .gnb .depth2 a {
        position: relative;
        display: block;
        padding: 12px 0;
        font-size: 14px;
        line-height: 20px;
        color: #fff;
        letter-spacing: -1px;
        /* text-transform: uppercase; */
        word-break: keep-all;
        font-weight: 400;
    }

    #header .gnb .depth2 li.in>a {
        padding-left: 20px;
        padding-right: 20px;
    }

    #header .gnb .depth2 li.in>a:after {
        position: absolute;
        font-family: 'FontAwesome';
        content: "\f054";
        font-size: 10px;
        top: 50%;
        right: 10px;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        color: rgba(255, 255, 255, .8);
    }

    #header .gnb .depth2 li:hover {
        background: #000;
        transition: .3s;
    }

    #header .gnb>ul>li:hover .depth2 {
        display: block;
        z-index: 9999;
        height: auto;
        opacity: 1;
    }

    /* 3depth */
    #header .gnb .depth2 ul {
        position: absolute;
        display: none;
        width: 100%;
        top: -1px;
        left: 100%;
        background: rgba(6, 6, 6, .7);
    }

    #header .gnb .depth2>li:hover ul {
        display: block;
    }

    #header .gnb .depth2 ul li {
        border-top: 1px solid rgba(76, 76, 76, .7);
    }

    #header .gnb .depth2 ul li:hover {
        background: rgba(6, 6, 6, .7);
    }

    .btn-all-menu {
        position: absolute;
        top: 38px;
        left: 50%;
        width: 32px;
        height: 25px;
        border: 1px solid #cecece;
        margin-left: 487px;
        cursor: pointer;
    }

    .btn-all-menu span {
        position: absolute;
        left: 50%;
        margin-left: -10px;
        width: 20px;
        height: 2px;
        background: #ababab;
    }

    .btn-all-menu span:nth-child(1) {
        top: 5px;
    }

    .btn-all-menu span:nth-child(2) {
        top: 50%;
        margin-top: -1px;
    }

    .btn-all-menu span:nth-child(3) {
        bottom: 5px;
    }

    .all-menu-wrap {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999999999;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .85);
    }

    .all-menu-wrap>ul {
        position: absolute;
        top: 60px;
        left: 50%;
        transform: translateX(-50%);
        padding: 30px 30px 50px;
        width: 960px;
        background: #fff;
        font-size: 0;
    }

    .all-menu-wrap>ul>li {
        display: inline-block;
        padding: 0 30px;
        width: 33.33333333333333%;
        vertical-align: top;
    }

    .all-menu-wrap>ul>li>a {
        display: block;
        margin-top: 20px;
        padding: 10px;
        border-bottom: 1px solid #222;
        font-size: 22px;
        line-height: 1.3;
        color: #222;
    }

    .all-menu-wrap>ul>li li a {
        display: block;
        padding: 10px;
        border-bottom: 1px solid #ddd;
        font-weight: 300;
        font-size: 18px;
        line-height: 1.3;
    }

    .all-menu-wrap p {
        position: absolute;
        top: 100px;
        left: 50%;
        margin-left: 424px;
        cursor: pointer;
    }

    .all-menu-wrap p span {
        display: block;
        margin-top: 5px;
        font-size: 0;
        width: 30px;
        height: 30px;
    }

    .all-menu-wrap p span:before {
        content: '';
        display: block;
        width: 100%;
        height: 1px;
        background: #666;
        transform: rotate(-45deg);
    }

    .all-menu-wrap p span:after {
        content: '';
        display: block;
        width: 100%;
        height: 1px;
        background: #666;
        transform: rotate(45deg);
    }

    #header .w-lang dd a:hover {
        color: rgba(255, 255, 255, .7);
    }
}

@media screen and (max-width:1200px) {

    .btn-all-menu,
    .all-menu-wrap {
        display: none;
    }

    #header .w-lang {
        display: none;
    }

    #header .m-menu-btn {
        display: block;
        position: absolute;
        top: 24px;
        right: 30px;
        width: 42px;
        height: 34px;
        z-index: 9999;
        cursor: pointer;
    }

    #header .m-menu-btn span {
        height: 6px;
        background: #fff;
        transition: .3s;
    }

    #header .m-menu-btn span:nth-child(1) {
        position: absolute;
        top: 50%;
        margin-top: -3px;
        width: 100%;
    }

    #header .m-menu-btn span:nth-child(2) {
        position: absolute;
        top: 0;
        width: 100%;
    }

    #header .m-menu-btn span:nth-child(3) {
        position: absolute;
        bottom: 0;
        width: 100%;
    }

    /* on */
    #header .m-menu-btn.on {
        z-index: 100000;
    }

    #header .m-menu-btn.on span {
        background: #fff;
    }

    #header .m-menu-btn.on span:nth-child(1) {
        opacity: 0;
    }

    #header .m-menu-btn.on span:nth-child(2) {
        height: 2px;
        transform: translateY(16px) rotate(-45deg);
    }

    #header .m-menu-btn.on span:nth-child(3) {
        height: 2px;
        transform: translateY(-16px) rotate(45deg);
    }

    #header .gnb {
        float: none;
        position: fixed;
        top: 0;
        right: -100%;
        z-index: 99999;
        width: 100%;
        height: 100vh;
        opacity: 0;
        text-align: left;
    }

    #header .m-gnb-bg {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .8);
    }

    #header .m-lang {
        position: fixed;
        top: 0;
        right: -100%;
        z-index: 100000;
        padding: 18px 0 0 33px;
        width: 80%;
        height: 80px;
        background: #af0c0d;
        opacity: 0;
        font-size: 0;
    }

    #header .m-lang .w-lang {
        display: block;
        float: left;
        padding: 5px 0;
    }

    #header .m-lang .w-lang dd {
        margin-left: 0;
        margin-right: 10px;
    }

    #header .m-lang .w-lang dd a {
        font-size: 23px;
        text-align: center;
    }

    html[lang="ko"] #header .m-lang .w-lang dd.lang.ko a:after, html[lang="en"] #header .m-lang .w-lang dd.lang.en a:after, html[lang="zh"] #header .m-lang .w-lang dd.lang.zh a:after {
        bottom: 0;
    }

    /* on */
    #header .gnb>ul {
        overflow-x: hidden;
        position: absolute;
        top: 80px;
        right: 0;
        z-index: 100000;
        width: 80%;
        height: calc(100% - 80px);
        background: #fff;
    }

    /* depth */
    #header .gnb ul a {
        display: block;
        padding-left: 36px;
        width: 100%;
        line-height: 1;
    }

    /* 1depth */
    #header .gnb>ul>li {
        width: 100%;
    }

    #header .gnb>ul>li>a {
        position: relative;
        padding-top: 20px;
        padding-bottom: 20px;
        border-top: 1px solid #ddd;
        font-size: 23px;
        color: #333;
    }

    #header .gnb>ul>li>a:before {
        position: absolute;
        top: 16px;
        right: 30px;
        content: "\f107";
        display: block;
        font-family: 'FontAwesome';
        font-size: 30px;
        line-height: 1;
    }

    #header .gnb>ul>li:first-child>a {
        border-top: 0 none;
    }

    #header .gnb>ul>li:last-child>a {
        border-bottom: 1px solid #ddd;
    }

    /* 2epth */
    #header .gnb>ul>li>ul {
        display: none;
    }

    #header .gnb>ul>li>ul,
    #header .gnb>ul>li>ul>li {
        width: 100%;
        background: #e8e8e8;
    }

    #header .gnb>ul>li>ul>li a {
        padding-top: 15px;
        padding-bottom: 15px;
        border-top: 1px solid #d1d1d1;
        font-size: 17px;
    }

    #header .gnb>ul>li>ul>li:first-child>a {
        border-top: 0 none;
    }

    /* on */
    #header .gnb>ul>li.on>a {
        background: #3f3f40;
        border-top: 0 none;
        color: #fff;
    }

    #header .gnb>ul>li.on>a:before {
        content: '\f106';
    }

    #header .gnb>ul>li .depth2>li>ul li a {
        font-weight: 400;
    }

    #header .gnb>ul>li .depth2>li>ul li a:before {
        content: "-";
        display: inline-block;
        margin-right: 10px;
    }
}

@media screen and (max-width:768px) {
    #header .m-menu-btn {
        top: 16px;
        right: 20px;
        width: 28px;
        height: 23px;
    }

    #header .m-menu-btn span {
        height: 3px;
    }

    #header .m-menu-btn span:nth-child(1) {
        top: 10px;
        margin-top: auto;
    }

    #header .m-menu-btn.on span:nth-child(2) {
        height: 2px;
        transform: translateY(10.5px) rotate(-45deg);
    }

    #header .m-menu-btn.on span:nth-child(3) {
        height: 2px;
        transform: translateY(-10.5px) rotate(45deg);
    }

    #header .gnb>ul {
        top: 55px;
        height: calc(100% - 55px);
    }

    #header .gnb ul a {
        padding-left: 20px;
    }

    #header .gnb>ul>li>a:before {
        top: 12px;
        right: 20px;
        font-size: 23px;
    }

    #header .m-lang {
        padding: 12px 0 0 20px;
        height: 55px;
    }

    #header .m-lang .w-lang {
        padding: 7px 0;
    }

    #header .m-lang .w-lang dd a {
        font-size: 13px;
    }

    #header .gnb>ul>li>a {
        padding-top: 16px;
        padding-bottom: 16px;
        font-size: 15px;
    }

    #header .gnb>ul>li>ul>li a {
        padding-top: 12px;
        padding-bottom: 12px;
        font-size: 13px;
    }
}

/*
	footer
*/
#footer {
    position: relative;
    width: 100%;
    height: 100%;
    background: #343333;
}

#footer .footer-inner {
    margin: 0 auto;
    max-width: 1200px;
    text-align: center;
}

#footer .footer-detail-all {
    padding: 2rem 0 1rem;
}

@media screen and (min-width:769px) {
    #footer .footer-detail-all {
        padding: 4rem 0 3rem;
    }
}

@media screen and (min-width:992px) {
    #footer .footer-detail-all {
        padding: 5.125rem 0 5.125rem;
    }
}

#footer .footer-logo {
    font-size: 1.875rem;
    color: #fff;
}

@media screen and (min-width:769px) {
    #footer .footer-logo {
        margin-bottom: 2rem;
        font-size: 2.1875rem;
    }
}

.footer-info-detail-wrap {
    font-size: .875rem;
    color: #e8e8e8;
}

@media screen and (min-width:769px) {
    .footer-info-detail-wrap {
        font-size: 1rem;
    }
}

@media screen and (min-width:992px) {
    .footer-info-detail-wrap {
        font-size: 1.125rem;
    }
}

.footer-info-detail-wrap .email {
    display: inline-block;
    padding-left: 2.625rem;
    background: url('/html/_skin/seil/img/common/ico_paper_plain.png') left center no-repeat;
    background-size: auto 100%;
    font-weight: 300;
}

.footer-term-wrap {
    margin-top: 2.375rem;
    margin-bottom: 1rem;
}

@media screen and (min-width:481px) {
    .footer-term-wrap {
        margin-top: 0;
    }
}

.footer-term-wrap>li {
    vertical-align: middle;
    padding-right: 1rem;
    padding-left: 1rem;
}

@media screen and (min-width:481px) {
    .footer-term-wrap>li {
        display: inline-block;
        margin-left: .5rem;
        padding-right: 0;
        padding-left: 0;
    }

    .footer-term-wrap>li:first-child {
        margin-left: 0;
    }
}

.footer-term-wrap>li a {
    display: block;
    width: 100%;
    margin-top: 0.5rem;
    padding: 1rem;
    background-color: #504e4e;
    color: #fff;
    font-size: .75rem;
    font-family: 'Noto Sans KR', sans-serif;
    line-height: 1;
}

.footer-term-wrap>li a:hover {
    opacity: 0.75;
}

@media screen and (min-width:481px) {
    .footer-term-wrap>li a {
        width: 150px;
        margin-top: 2.375rem;
        padding: 1rem;
        font-size: .875rem;
    }
}

@media screen and (min-width:769px) {
    .footer-term-wrap>li a {
        width: 205px;
        padding: 1.25rem 1rem;
    }
}

.footer-info {
    font-size: 0;
}

.footer-info>li {
    display: block;
    vertical-align: middle;
    padding-left: .5rem;
    padding-right: .5rem;
    margin-bottom: .5rem;
    font-weight: 100;
    font-size: .75rem;
    color: #e8e8e8;
    line-height: 1;
}

@media screen and (min-width:481px) {
    .footer-info>li {
        font-size: .875rem;
    }
}

@media screen and (min-width:769px) {
    .footer-info>li {
        display: inline-block;
        border-left: 1px solid #e8e8e8;
        font-size: 1.0625rem;
    }
}

.footer-info>li:first-child {
    margin-left: 0;
    border: 0;
}

.footer-info>li>span:not(:first-child) {
    margin-left: 1rem;
}

#footer .footer-copyright {
    padding-top: 1rem;
    padding-right: 1.5rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    background-color: #222121;
    font-size: .75rem;
    color: #e8e8e8;
    line-height: 1;
    word-break: break-word;
}

@media screen and (min-width:769px) {
    #footer .footer-copyright {
        padding-top: 1.25rem;
        padding-bottom: 1.25rem;
        font-size: .875rem;
    }
}

@media screen and (min-width:1025px) {
    #footer .footer-copyright {
        padding-top: 1.75rem;
        padding-bottom: 1.75rem;
        font-size: 1.0625rem;
    }
}

/* ---------------------------------- contents */
#contents {
    position: relative;
    width: 100%
}

@media screen and (min-width:1201px) {
    #contents {
        min-height: calc(100vh - 255px);
    }
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width:768px) {
    #contents {
        min-height: calc(100vh - 288px);
    }
}

.top-btn {
    position: fixed;
    z-index: 9999;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background: rgba(215, 23, 24, .7);
    font-size: 14px;
    line-height: 50px;
    color: #fff;
    text-align: center;
    cursor: pointer;
    display: none;
}

.top-btn.on {
    position: absolute;
    bottom: auto;
    top: -80px;
}

@media screen and (min-width: 1201px) {
    .top-btn:hover {
        background: rgba(215, 23, 24, 1);
    }
}

/*
	path
*/
.path-wrap .path {
    font-size: 0;
}

.path-wrap .path>li {
    display: inline-block;
    padding-right: 20px;
    font-size: .875rem;
    color: #999;
    line-height: 60px;
}

.path-wrap .path>li:last-child {
    color: #222;
}

.path-wrap .path>li>span {
    display: inline-block;
    position: relative;
    line-height: 1;
}

.path-wrap .path>li>span:after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 1px;
    width: 20px;
    height: 100%;
    background-image: url(/html/_skin/seil/img/common/ico_path_arrow_right.png);
    background-repeat: no-repeat;
    background-position: center center;
}

.path-wrap .path>li:last-child>span:after {
    display: none;
}

/* ------------------------ custom style */
/*
    base by bootstrap
*/
.figure-caption {
    font-size: 100%;
    color: initial;
}

/*
    about title style
*/
.tit-border-bottom .tit-border-bottom__txt {
    display: inline-block;
    position: relative;
}

.tit-border-bottom .tit-border-bottom__txt:after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0;
    display: inline-block;
    width: 100%;
    height: 0;
    border-bottom: 1px solid #000;
}

/*
    font
*/
.font-point {
    font-family: 'NanumSquare', sans-serif;
}

[class*="f-s-md"] {
    font-size: 1.5rem;
}

[class*="f-s-lg"] {
    font-size: 1.875rem;
}

[class*="--bold"] {
    font-weight: 700;
    font-weight: bold;
}

[class*="--bolder"] {
    font-weight: 900;
}

@media screen and (min-width:769px) {
    [class*="f-s-md"] {
        font-size: 1.875rem;
    }

    [class*="f-s-lg"] {
        font-size: 2.25rem;
    }
}

@media screen and (min-width:992px) {
    [class*="f-s-md"] {
        font-size: 1.875rem;
    }

    [class*="f-s-lg"] {
        font-size: 2.8125rem;
    }
}

/*
    about text style
*/
.txt-space {
    display: flex;
    -ms-display: flex;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    -ms-flex-pack: justify;
    font-size: 1rem;
    font-family: 'Noto Sans KR', sans-serif;
}

.txt-space>.space {
    margin-right: .5rem;
}

@media screen and (min-width:769px) {
    .txt-space {
        font-size: 1.25rem;
    }

    .txt-space>.space {
        margin-right: .75rem;
    }
}

@media screen and (min-width:992px) {
    .txt-space {
        font-size: 1.5rem;
    }

    .txt-space>.space {
        margin-right: 1rem;
    }
}

@media screen and (min-width:1201px) {
    .txt-space {
        font-size: 1.75rem;
    }

    .txt-space>.space {
        margin-right: 1.25rem;
    }
}

/*
    about background style
*/
.bg-c-gray {
    /* only for background color */
    background-color: #f8f8f8;
}

/*
    about list style
*/
/* common */
.list__item {
    line-height: 1;
}

.list__item-caption {
    text-align: center;
    line-height: 1.5;
    word-break: keep-all;
}

.list__item-caption>.txt-ico {
    display: inline-block;
    padding-left: 16px;
    background-image: url(/html/_skin/seil/img/sub/ico_slash.gif);
    background-repeat: no-repeat;
    background-position: left 5px;
}

/* .list__item-caption>.txt-ico:before {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    left: -16px;
    width: 10px;
    height: 11px;
    background-image: url(/html/_skin/seil/img/sub/ico_slash.gif);
    background-repeat: no-repeat;
    background-position: top;
} */
.caption-bg-gray .list__item-caption {
    background-color: #ededed;
}

/* img-with-caption-list */
.img-with-caption-list,
.img-with-caption-list--border-t {
    margin-left: -20px;
    margin-right: -20px;
}

.img-with-caption-list>[class^="col"],
.img-with-caption-list--border-t>[class^="col"] {
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 2.5rem;
}

.img-with-caption-list .list__item {
    background-color: #fff;
    text-align: center;
    box-shadow: 3px 4px 9px 0 rgba(26, 26, 26, 0.1);
    line-height: 1;
}

.img-with-caption-list.caption-bg-gray .list__item {
    box-shadow: 3px 4px 9px 0 rgba(0, 0, 0, 0.16);
}

.img-with-caption-list .list__item img {
    width: 100%;
}

@media screen and (min-width:769px) {
    .img-with-caption-list .list__item img {
        width: auto;
    }
}

.img-with-caption-list .list__item-caption {
    padding: 1rem .5rem;
    color: #272727;
    font-size: .875rem;
}

@media screen and (min-width:769px) {
    .img-with-caption-list .list__item-caption {
        font-size: 1.125rem;
    }
}

.img-with-caption-list--border-t .list__item {
    position: relative;
    margin-top: 10px;
    background-color: #fff;
    box-shadow: 2px 5px 10px rgba(0, 0, 0, 0.1);
}

@media screen and (min-width:769px) {
    .img-with-caption-list--border-t>[class*="col-md"] .list__item {
        height: 100%;
    }
}

@media screen and (min-width:992px) {
    .img-with-caption-list--border-t>[class*="col-lg"] .list__item {
        height: 100%;
    }
}

@media screen and (min-width:1201px) {
    .img-with-caption-list--border-t>[class*="col-xl"] .list__item {
        height: 100%;
    }
}

.img-with-caption-list--border-t .list__item:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: -10px;
    width: 100%;
    height: 0;
    border-top: 2px solid #d61718;
}

.img-with-caption-list--border-t .list__item-caption {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.img-with-caption-list--border-t .list__item-tit {
    font-size: 1rem;
    font-weight: 500;
}

@media screen and (min-width:769px) {
    .img-with-caption-list--border-t .list__item-tit {
        font-size: 1.125rem;
        font-family: 'Noto Sans KR', sans-serif;
        font-weight: bold;
    }
}

.img-with-caption-list--border-t .list__item-caption>.table-wrap {
    margin-top: 2.5rem;
}

.img-with-caption-list--border-t .list__item-caption>.table-wrap th,
.img-with-caption-list--border-t .list__item-caption>.table-wrap td {
    vertical-align: middle;
}

/* border-t-caption-list */
.border-t-caption-list .list__item-img-wrap {
    display: flex;
    align-items: center;
    height: 94px;
}

.border-t-caption-list .list__item-img-wrap>span {
    width: 100%;
}

.border-t-caption-list .list__item-caption {
    margin-top: 3.125rem;
    padding-top: 1.875rem;
    padding-left: 1rem;
    border-top: 1px solid #c8c8c8;
    text-align: left;
    color: #6c6c6c;
}

/* dl */
/* common */
.dfn dt,
.dfn-inline dt {
    font-weight: 500;
}

@media screen and (min-width:769px) {

    .dfn dt,
    .dfn-inline dt {
        font-size: 1.125rem;
        font-weight: bold;
        line-height: 1;
    }

    html:lang(ko) .dfn dt,
    html:lang(en) .dfn dt,
    html:lang(ko) .dfn-inline dt,
    html:lang(en) .dfn-inline dt {
        font-family: 'NanumSquare', sans-serif;
    }
}

.dfn dt {
    margin-bottom: .5rem;
    color: #dc2323;
}

/* dfn inline */
.dfn-inline dt,
.dfn-inline dd {
    display: inline-block;
    vertical-align: middle;
}

@media screen and (min-width:769px) {
    .dfn-inline dt {
        padding-right: 8px;
        margin-right: 5px;
        margin-bottom: 0;
        border-right: 1px solid #c3c3c3;
    }
}

.dfn-inline dd {
    color: #6c6c6c;
}

/* dfn dd with ico */
.dfn-dd-ico dd>.txt-ico {
    display: inline-block;
    padding-left: 16px;
    background-image: url(/html/_skin/seil/img/sub/ico_slash.gif);
    background-repeat: no-repeat;
    background-position: left 5px;
}

/*
.dfn-dd-ico dd>.txt-ico:before {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    left: -16px;
    width: 10px;
    height: 11px;
    background-image: url(/html/_skin/seil/img/sub/ico_slash.gif);
    background-repeat: no-repeat;
    background-position: top;
} */
/* about image style */
.dfn-inline+figure {
    margin-top: 4.375rem;
}

.figure-inline-block,
.figure-inline-block img {
    display: inline-block;
}

.figure-caption-gap>figcaption {
    margin-top: 3.75rem;
}

/*
    about button style
*/
[class*="btn"]:hover {
    text-decoration: none;
}

.btn-circle-arrow {
    position: relative;
    text-align: left;
}

.btn-circle-arrow>span {
    display: inline-block;
    vertical-align: middle;
}

.btn-circle-arrow .btn__txt {
    margin-right: .5rem;
}

.btn-circle-arrow .btn__ico {
    position: relative;
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: right;
    /* background-image: url('/html/_skin/seil/img/common/ico_arrow_right_unbalance.png'); */
    background-repeat: no-repeat;
    background-position: center center;
}

.btn-circle-arrow .btn__ico:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: right;
    background-color: #ff0000;
    border-radius: 100px;
    transition: transform, 0.3s ease-in-out;
    -webkit-transition: transform, 0.3s ease-in-out;
}

.ico-arrow {
    content: '';
    position: relative;
    display: block;
    width: 9px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    background-image: url('/html/_skin/seil/img/common/ico_arrow_right_unbalance.png');
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 1;
}

/* hover */
.btn-circle-arrow:hover {
    color: #ff0000;
}

.btn-circle-arrow:hover .btn__ico:after {
    transform: scale(1.5);
}

/* btn-square */
.btn-square {
    position: relative;
    display: inline-block;
    min-width: 205px;
    padding: 1.5rem 1rem;
    line-height: 1;
    color: #fff;
    background-color: #7b7270;
    text-align: center;
}

.btn-square .btn__txt {
    position: relative;
    display: inline-block;
    padding-right: 20px;
    transition: padding, .2s ease-in-out;
    -ms-transition: padding, .2s ease-in-out;
    -webkit-transition: padding, .2s ease-in-out;
}

.btn-square .btn__txt:after {
    content: '';
    position: absolute;
    top: 3px;
    right: 0;
    display: inline-block;
    width: 13px;
    height: 10px;
    background-image: url(/html/_skin/seil/img/common/ico_arrow_right_with_bar.png);
    background-repeat: no-repeat;
    background-position: right center;
    line-height: 1;
    font-weight: normal;
}

/* hover */
.btn-square:hover .btn__txt {
    padding-right: 26px;
}

.btn-square:hover {
    background-color: #ff0000;
    color: #fff;
}

/* btn-arrow-bottom (only have line arrow) */
.btn-arrow-bottom {
    display: inline-block;
    padding-right: 1.5rem;
    background-image: url(/html/_skin/seil/img/common/ico_arrow_right_bottom.png);
    background-repeat: no-repeat;
    background-position: right calc(100% - 5px);
    transition: padding, .2s ease-in-out;
    -ms-transition: padding, .2s ease-in-out;
    -webkit-transition: padding, .2s ease-in-out;
}

.btn-arrow-bottom:hover {
    color: #492f30;
    padding-right: 1.8rem;
}

/*
    tab
*/
.section-pagetab {
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
}

.section-pagetab__nav {
    position: relative;
    left: 1px;
    margin-bottom: .5rem;
    /* align-items: center; */
}

@media screen and (min-width:992px) {
    .section-pagetab__nav {
        margin-bottom: 3.625rem;
    }
}

@media screen and (min-width:769px) {
    .section-pagetab__nav {
        margin-bottom: 2.5rem;
    }
}

.section-pagetab__nav>[class^="col"] {
    margin-left: -1px;
    padding: 1px;
    text-align: center;
    /* font-size: 3.4375rem; */
}

.section-pagetab__nav a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    /* padding-top: 1.5rem; */
    padding-left: .5rem;
    padding-bottom: 1.5rem;
    padding-right: .5rem;
    font-size: 1.5rem;
    word-break: break-word;
    letter-spacing: -0.171875rem;
}

@media screen and (min-width:748px) {
    .section-pagetab__nav a {
        font-size: 2.5rem;
    }
}

@media screen and (min-width:992px) {
    .section-pagetab__nav a {
        font-size: 3.4375rem;
    }
}

@media screen and (max-width:768px) {
    .section-pagetab__nav a {
        /* padding-top: 1rem; */
        padding-bottom: 1rem;
    }
}

.section-pagetab__nav a span {
    display: inline-block;
}

.section-pagetab__nav a.active span {
    border-bottom: 4px solid #00243d;
    font-weight: 900;
    line-height: 1;
}

/* align */
.vertical-top-el {
    display: inline-block;
    vertical-align: top;
}

/*
    about table style
*/
.table-wrap {
    width: 100%;
    overflow: auto;
}

table {
    width: 100%;
    background-color: #fff;
}

table th,
table td {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    font-family: 'Noto Sans KR', sans-seif;
}

@media screen and (min-width:769px) {

    table th,
    table td {
        /* display: block; */
        padding-right: 1.5rem;
        padding-left: 1.5rem;
        font-size: 1.0625rem;
        font-family: 'Noto Sans KR', sans-seif;
    }
}

table th {
    font-weight: bolder;
}

table td {
    padding-top: .875rem;
    padding-bottom: .875rem;
}

.tbody-th-bg tbody th {
    background-color: #f1f3f6;
}

table thead th {
    color: #272727;
}

@media screen and (min-width:769px) {
    table thead th {
        font-size: 1.125rem;
    }
}

table tbody td {
    font-size: .875rem;
    color: #848484
}

@media screen and (min-width:769px) {
    table tbody td {
        font-size: 1.0125rem;
    }
}

/*
    about box style (for wrap)
*/
.box-border-t {
    background-color: #fff;
    border-top: 2px solid #272727;
    padding: 2.5rem 1rem 4.5rem;
}

.box-img-txt-align {
    text-align: center;
}

.box-img-txt-align .dfn {
    text-align: left;
}

/*
    about layout style
*/
.col-5ea, .col-xl-5ea, .col-lg-5ea,
.col-md-5ea, .col-sm-5ea {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-5ea {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

@media (min-width: 576px) {
    .col-sm-5ea {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 768px) {
    .col-md-5ea {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 992px) {
    .col-lg-5ea {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 1201px) {
    .col-xl-5ea {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

.row-space2 {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    margin-left: -15px;
    margin-right: -15px;
}

.row-space2>[class^="col-"] {
    padding-left: 15px;
    padding-right: 15px;
}

/*
    about setting
 */
.d-none-search .board-search-wrap {
    display: none !important;
}

/*
    about img class
*/
.img-responsive {
    width: 100%;
}

@media (min-width: 576px) {
    .img-sm-responsive {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .img-md-responsive {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .img-lg-responsive {
        width: 100%;
    }
}

@media (min-width: 1381px) {
    .img-xl-responsive {
        width: 100%;
    }
}

/*
    about slick
*/
/* default (square) */
.slick-custom-nav {
    left: 1px;
    font-size: 0;
}

.slick-custom-nav>li {
    display: inline-block;
    vertical-align: middle;
    margin-left: -1px;
}

.slick-custom-nav>li:first-child {
    margin-left: 0;
}

.slick-custom-nav a {
    display: block;
    width: 44px;
    height: 44px;
    border: 1px solid #39302f;
    background-color: #fff;
}

.slick-custom-nav a:hover {
    opacity: 0.5;
}

.slick-custom-nav .ico {
    display: flex;
    -ms-display: flex;
    align-items: center;
    -ms-flex-align: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 0;
}

.slick-custom-nav .ico i {
    content: '';
    display: inline-block;
    width: 19px;
    height: 19px;
    border-top: 1px solid #39302f;
    border-left: 1px solid #39302f;
}

.slick-custom-nav #slick-prev .ico i {
    margin-left: 9px;
    transform: rotate(-47deg);
    -webkit-transform: rotate(-47deg);
    -ms-transform: rotate(-47deg);
}

.slick-custom-nav #slick-next .ico i {
    margin-right: 9px;
    transform: rotate(133deg);
    -webkit-transform: rotate(133deg);
    -ms-transform: rotate(133deg);
}

/* circle */
.slick-custom-nav--circle>li {
    margin-left: 8px;
}

.slick-custom-nav--circle a {
    width: 55px;
    height: 55px;
    border-radius: 100px;
}

.slick-custom-nav--circle a:hover {
    opacity: 0.5;
    border-color: #ee1f42;
}

.slick-custom-nav--circle .ico i {
    width: 8px;
    height: 8px;
    border-width: 2px;
}

.slick-custom-nav--circle a:hover .ico i {
    border-color: #ee1f42;
}

.slick-custom-nav--circle #slick-prev .ico i {
    margin-left: 3px;
}

.slick-custom-nav--circle #slick-next .ico i {
    margin-right: 3px;
}

/* box */
.slick-custom-nav--box a {
    display: flex;
    -ms-display: flex;
    align-items: center;
    -ms-flex-align: center;
    width: 74px;
    height: 74px;
    background-color: #7b7270;
    border: 0;
}

.slick-custom-nav--box a>p {
    display: inline-block;
    width: 100%;
    padding-top: 4px;
    padding-bottom: 4px;
    border-left: 1px solid #999594;
}

.slick-custom-nav--box li:first-child a>p {
    border-left: 0;
}

.slick-custom-nav--box .ico i {
    border-color: #fff;
    width: 12px;
    height: 12px;
}