@import url(https://use.fontawesome.com/releases/v6.6.0/css/all.css);
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');
@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Gowun+Dodum&display=swap');
@charset "utf-8";

/* Reset CSS  */
html { height: 100%; overflow-y:scroll;}
body { font-size: 13px; color:#000;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p { margin: 0px; padding:0px;  list-style:none;  font-family:"Pretendard", "Noto Sans KR", "Malgun Gothic", "Dotum", sans-serif;}
fieldset{ border: 0px; }
a{font-style:normal; text-decoration:none; color:#000;}
hr, legend {height: 0; left: -5000px; line-height: 0; overflow-x: hidden; overflow-y: hidden; position: absolute; visibility: hidden;width: 0;}
caption {font-size: 0; height: 0; line-height: 0; visibility: hidden; width: 0;}
* {-webkit-text-size-adjust:none;}
* { margin:0; padding:0; border:0; outline:0;  }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
img, video { max-width:100%; border:0; height:auto; }
table { border-collapse:collapse; border-spacing:0; border: 0px; }
input, select { vertical-align:middle; }

label { cursor:pointer; }
.blind,legend,hr,caption { display:block; overflow:hidden; position:absolute; top:0; left:-1000em; }
i,em,address { font-style:normal; font-weight:normal; }
td,th {vertical-align: middle;line-height: 1.6;}
td strong {font-weight: 100; vertical-align: bottom;}
a:hover{text-decoration:none;}
ul:after{content:""; display:block; clear:both;}

.container { max-width: 1410px; width:100%; margin: 0 auto; position: relative; box-sizing: border-box; padding:0 15px;}
.container:after {content: ""; display: block; clear: both;}

/*header*/
#m-hd{position:relative; width:100%; padding:0; height:90px; z-index: 5; border-bottom:1px solid #eee}
#m-hd:hover{background: #fff;}
#m-hd:after{content:""; display:block; clear:both}
#m-hd #m-logo{position: absolute; height: 100%; max-width:150px; width:100%; top:50%; left:60px; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 9000;}
#m-hd #m-logo.en-logo{max-width:200px;}
#m-hd #m-logo a{position:relative; display:block; height: 100%;}
#m-hd #m-logo a img{position:absolute; left:0; top:50%;  transform: translateY(-50%); -webkit-transform: translateY(-50%); animation-duration: 20s; animation-iteration-count: infinite;}
#m-hd #m-logo a img.logo01{animation-name: LogoChange01;}
#m-hd #m-logo a img.logo02{animation-name: LogoChange02;}

@keyframes LogoChange01{
    0% {opacity: 1;}
    48% {opacity: 1;}
    50% {opacity: 0;}
    98% {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes LogoChange02{
    0% {opacity: 0;}
    48% {opacity: 0;}
    50% {opacity: 1;}
    98% {opacity: 1;}
    100% {opacity: 0;}
}

#m-hd #mobile-menu.active span{background-color: #000;}
#m-hd .container{height: 100%;}
/* #m-hd .container{top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%);} */
#admin-join{position: fixed; right:0; top:120px; z-index: 9999;}
#admin-join a{display:block; padding:15px; color:#fff;}
#admin-join .logout{background:#212121}
#admin-join .admin-icon{background:#ff3746}
#m-hd #m-nav {text-align: center;}
#m-hd #m-nav::after{content:""; display:block; clear:both}
/* #lang-nav{position:absolute; top:50%; right:0; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 9000;} */
#lang-nav li{margin-left:30px; float:left; position:relative;}
#lang-nav li::before{content:""; display:block; position:absolute; width:1px; height:14px; background:#fff; left:-15px; top:5px;}
#lang-nav li:first-child{margin-left:0 }
#lang-nav li:first-child::before{display:none;}
#lang-nav li a{font-size:18px; font-weight: 700; color:#fff; opacity:0.6;}
#lang-nav li a.active{color:#fff; opacity:1;}
#m-hd #m-gnb{display:flex; align-items: center; justify-content: center;}
#m-hd #m-gnb > li{text-align:center; margin-right:80px; position: relative;}
#m-hd #m-gnb > li:last-child{margin-right: 0;}
#m-hd #m-gnb > li > a{font-size:18px; font-weight:500; margin:0 auto; display:block; color:#000; box-sizing:border-box;position:relative; line-height:90px; position: relative;}


/*megadrop*/
#m-hd #m-gnb > li > a{color:#212121; font-weight: bold;}
#m-hd #m-gnb > li:hover > a::after{content:""; display:block; position: absolute; bottom:25px; width:100%; height:3px; background:#212121}

#m-hd #m-gnb .lnb{position:absolute; width:230px; display:none; background:#fff; left: 50%; top:75px; transform: translateX(-50%); border:1px solid #f5f5f7; box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.08); border-radius: 15px;}
#m-hd #m-gnb > li:hover .lnb{display:inline-block; }
#m-hd #m-gnb .lnb li{}
#m-hd #m-gnb .lnb li:last-child{margin-right:0px }
#m-hd #m-gnb .lnb li a{display:block; padding:11px 0; font-size:17px; color:#cacaca;  font-weight: 700;}
#m-hd #m-gnb .lnb li a:hover{color:#000}
#m-hd #m-gnb .lnb li a p{margin-top:7px;}
#m-hd #m-gnb .lnb li:last-child a p{margin-bottom:7px;}

.lang-box .lang{font-size:18px; color:#212121; font-weight: 700; padding:6px 22px; border-radius:18px ;}
.lang-box .lang.active{background:#212121; color:#fff;}

.etc-nav{position:absolute; right:60px; top:50%; transform: translateY(-50%); display:flex; align-items: center;}
#m-hd #m-gnb > li:nth-child(2) > .lnb,
#m-hd #m-gnb > li:nth-child(5) > .lnb,
#m-hd #m-gnb > li:nth-child(6) > .lnb{display:none;}

#m-hd #m-gnb.en-gnb > li:nth-child(2) > .lnb,
#m-hd #m-gnb.en-gnb > li:nth-child(3) > .lnb,
#m-hd #m-gnb.en-gnb > li:nth-child(4) > .lnb{display:none;}


#all-menu{display:none;}
#mobile-btn{display:none; cursor: pointer;}
#mobile-menu-open{width:32px; height: 21px; }
#mobile-menu-open,
#mobile-menu-open span {display: inline-block; transition: all .2s;box-sizing: border-box;}
#mobile-menu-open {position: relative;}
#mobile-menu-open span {position: absolute; right: 0; width: 100%; height: 3px; background-color: #212121;}

#mobile-menu-open span:nth-of-type(1) {top: 0; width:calc(100% - 7px); }
#mobile-menu-open span:nth-of-type(2) {top: 9px;}
#mobile-menu-open span:nth-of-type(3) {bottom: 0; width:calc(100% - 7px);}
#mobile-menu-open:hover span:nth-of-type(1),
#mobile-menu-open:hover span:nth-of-type(3){width:100%;}
#mobile-menu-open.active span{background-color: #555;}
#mobile-menu-open.active span:nth-of-type(1) {-webkit-transform: translateY(14px) rotate(-45deg); transform: translateY(14px) rotate(-45deg);}
#mobile-menu-open.active span:nth-of-type(2) {opacity: 0;}
#mobile-menu-open.active span:nth-of-type(3) {-webkit-transform: translateY(-14px) rotate(45deg);transform: translateY(-14px) rotate(45deg);}


#mobile-menu-close,
#mobile-menu-close span {display: inline-block; transition: all .4s;box-sizing: border-box;}
#mobile-menu-close {position: absolute; right:60px; top:60px; width: 30px; height: 30px; }
#mobile-menu-close span {position: absolute; left: 0; width: 100%; height: 3px; background-color: #fff; border-radius: 2px}

#mobile-menu-close span:nth-of-type(1) {top:14px; transform: rotate(45deg);}
#mobile-menu-close span:nth-of-type(2) {top:14px;transform: rotate(-45deg);}

#all-menu{position:fixed; display:block; background:#fff; width:100%;  height:100%; z-index:9999; top:0; right:-100%; opacity:0;  background:rgba(0, 0, 0, 0.9 ); width:100%;}
#menu-box{height: 100%; display:flex; align-items:center; justify-content: flex-end}

#all-menu #all-gnb > li > a{padding:23px 0; font-size:42px; display:block; text-align:left; color:#fff; font-weight:700; opacity:0.3;}

#all-menu #all-gnb > li > a.active{opacity: 1;}


#all-gnb ul a{font-size:15px; font-weight: 500; color:#aaa; display:block;}
#all-gnb ul > li{padding:8px 0}
#all-menu #all-nav{ position:relative; width:80%; padding-right:20%}
#all-menu #all-gnb .lnb{display:none;}
#all-menu #all-gnb .lnb li{float:left; margin-right:45px;}
#all-menu #all-gnb .lnb li a{ font-size:22px; color:#fff; font-weight: 700;}
#all-menu #all-gnb .lnb li a:hover{color:#147bd1; background: none;}
#all-menu #all-gnb .lnb li:last-child {margin-right:0;}

.mobile-lang{margin-bottom:20px;}
.mobile-lang .inner{display:flex;}
.mobile-lang a{font-size:22px;  color:#fff; opacity: 0.3; font-weight: 700; margin-right:30px;}
.mobile-lang a:last-child{margin-right:0px;}
.mobile-lang a.active{opacity:1;}


/*index 공통*/
.contents-box::after{content:""; display:block; clear:both;}
.box-wrap::after{content:""; display:block; clear:both;}
#board-contents{padding:60px 0;}
.board-section{padding:60px 0;}

/*index 공통*/
#wrap{overflow: hidden;}
.main-page-anchor { position: fixed;right: 60px; top: 50%;z-index: 30; text-align:center;  transform:translateY(-50%);
-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);-ms-transform:translateY(-50%); }
.main-page-anchor li{ margin-bottom:20px;}
.main-page-anchor li:last-child{ margin-bottom:0; }
.main-page-anchor a {display:block; width:12px; height:12px; border-radius:50%; background:#fff; transition: 0.3s; opacity:0.3; margin:0 auto;}
.main-page-anchor li.active > a {opacity:1 }

/* #fullpage section{ height: 936px;} */
.main-section .container{height: 100%;}
.main-section .symbol-title h5{font-size:23px; color:#a0a0a0; margin:5px 0 15px; font-weight: 500;}


#m-hd.hd-fixed #m-gnb > li > a{color:#000}
#m-hd.hd-fixed #m-logo .logo-white{display:none;}
#m-hd.hd-fixed #m-logo .logo-color{display:block;}
#m-hd.hd-fixed{background:#fff;}
#m-hd.hd-fixed #lang-nav li a.active{color:#000;}
#m-hd.hd-fixed #lang-nav li a{color:rgba(0, 0, 0, 0.4)}
#m-hd.hd-fixed #lang-nav li::before{background:#949494;}


@media (max-width:1360px){
    #m-hd #m-logo{left:30px;}
    #m-hd #m-gnb > li{margin-right:52px;}
    #m-hd #m-gnb > li > a{font-size:17px; }
    .etc-nav{right:30px}

  }

@media (max-width:1200px){/*mobile*/
    #all-menu #all-gnb > li > a{font-size:26px;}
    #m-hd{height:66px; }
    #m-hd #m-logo img{height:32px;}
    #all-menu #all-gnb .lnb li{float:none}
    #m-hd #m-nav{display:none;}
    #admin-join{display:none;}
    #m-hd .lang-box{display:none;}
    #mobile-menu-close{top:15px; right:15px;}
    #all-menu #all-gnb .lnb li a{font-size:17px;}
    
    #all-menu #all-gnb > li > a{padding:12px 0;}

    /*head*/
    #m-hd #m-logo{left:20px;}

    /*mobile bar*/
    #mobile-menu{width:33px; height: 26px; }
    #mobile-menu span:nth-of-type(2){top:12px; }
    #mobile-menu.active span:nth-of-type(1) {-webkit-transform: translateY(12px) rotate(-45deg);}
    #mobile-menu.active span:nth-of-type(3) {-webkit-transform: translateY(-12px) rotate(45deg);}

    #all-menu #all-gnb .lnb{display:none; margin-bottom:10px}
    .etc-nav{right:15px;}
    #mobile-btn{display:block}
    
    #all-menu #member-join {margin-right:0; margin-bottom:20px;}


  }


@media (max-width:768px){/*mobile*/


    #m-hd #m-logo.en-logo{max-width:150px;}
    /*index 공통*/
    .main-tit.resizing{text-align: center;}
    .main-tit.resizing::after{margin-right: auto; margin-left:auto;}

    /*index*/
    .main-page-anchor li{margin-bottom:15px;}
    .main-page-anchor{right:15px;}
}

#popup { position: fixed; z-index: 9999; display: none; width: 100%; max-width:1280px; height:auto;}
#bg { position: fixed;  z-index: 9998; top: 0; left: 0; display: none; width:100%; height:50vw; background-color:rgba(0, 0, 0, 0.8)}
#popup iframe{ height:50vw;  max-height:720px;}


#main-banner{ border-bottom:1px solid #eee; position: relative;}


.side-quick{position: absolute; right:0; top:50%; transform: translateY(-50%); width:60px; background:#fff; border-radius:32px 0 0 32px; z-index: 10; padding:32px 0; box-shadow: 2px 2px 13px 0 rgba(0, 0, 0, 0.1);}
.side-quick .menu-list{display:flex; justify-content: center; flex-direction:column; align-items: center;}
.side-quick .menu-list a{font-size:28px; margin-bottom:32px; }
.side-quick .menu-list a:last-child{margin-bottom:0px; }
.side-quick .menu-list a.youtube{color:#ff0000}
.side-quick .menu-list a.insta{color:#000}
.side-quick .menu-list a.newsletter{color:#3d3d3d}
.side-quick .menu-list a.naver{color:#03c75a}
.side-quick .menu-list img{max-width:26px;}


/*index section*/
#wrap{padding:60px 0;}
.main-section{padding:60px 0;}
.main-motif{display:inline-block; width:40px; height: 6px; position: relative; margin-bottom:12px;}
.main-motif::before{content:""; display:inline-block; width:6px; height: 13px; position: absolute; left:0; top:0; }
.main-motif::after{content:""; display:inline-block; width:6px; height: 13px; position: absolute; right:0; top:0; }
.main-tit-box h4{font-size:20px; margin-bottom:24px;}
.main-tit-box h3{font-size:36px;}
.main-tit-box p{font-size:18px; color:#666; line-height: 1.6; word-break: keep-all;}


.change-contents-wrap > div{display:none;}
.change-contents-wrap > div.active{display:block;}


/* .index .main-section01 .contents-box{overflow: hidden;} */
/* .index .main-section03{padding-bottom:120px} */
.index .main-section04{position: relative;}
/* .index .main-section04::before{content:""; width:100%; max-width: 380px; height: 100%; position: absolute; right:50%; top:0; background:#f5f5f7; border-radius: 80px 0 0 80px;}
.index .main-section04::after{content:""; width:50%; height: 100%; position: absolute; right:0; top:0; background:#f5f5f7} */
.index .main-section04 .main-tit-box{margin-bottom:40px;}

/* .index .main-section05 {padding-top:120px} */
.index .main-section05 .main-tit-box{margin-bottom:40px; text-align: center;}
.index .main-section05 .main-tit-box h5{font-size:18px; font-weight: 500;}
.index .main-section05 .link-box{margin-top:40px; text-align: center; }
.index .main-section05 .link-box a{display:inline-block; text-align: center; font-size:18px; color:#000; border:1px solid #000; padding:16px 32px; transition-duration: 0.2s; border-radius: 40px; margin:0 auto}

.index .main-section06 .main-tit-box{margin-bottom:40px; text-align: center;}
.index .main-section06 .main-tit-box h5{font-size:18px; font-weight: 500;}
.index .main-section06 .link-box{margin-top:40px; text-align: center; }
.index .main-section06 .link-box a{display:inline-block; text-align: center; font-size:18px; color:#000; border:1px solid #000; padding:16px 32px; transition-duration: 0.2s; border-radius: 40px; margin:0 auto}

.hd-sch-box{border:1px solid #ddd; padding:8px 20px; border-radius:25px; margin-right:45px;}

.hd-sch-box form{display:flex; justify-content: center;}

.hd-sch-box #hd-sch-bar{display:flex; align-items: center; justify-content: space-between; position: relative;}
.hd-sch-box #hd-sch-bar i{font-size:18px; background:none; color:#9e9e9e}
.hd-sch-box #hd-sch-bar input{font-size:18px;}
.hd-sch-box #hd-sch-bar input::placeholder{font-size:15px; color:#9e9e9e;}
.hd-sch-box #hd-sch-bar button{background:#fff;}


.sch-icon-view{display:none}
.sch-icon-view i{font-size:20px; }
.search-pop{ width:100%; height: 100vh; position: fixed; top:0; left:0; z-index: 15; background:rgba(255, 255, 255, 0.9);  display:none;}
.search-pop .inner{margin-top:100px}

.search-pop #hd-sch-bar{position:absolute; margin:0 auto; width:100%; display:flex; align-items: center; justify-content: center;}
.search-pop #hd-sch-bar i{font-size:18px; background:none; color:#9e9e9e}
.search-pop #hd-sch-bar input{font-size:18px;}
.search-pop #hd-sch-bar input::placeholder{font-size:15px; color:#9e9e9e;}
.search-pop #hd-sch-bar button{background:#fff;}
.sch-icon-view-close{font-size:30px; color:#515151; margin-bottom:20px; text-align: center;}

.sch-wrap{ padding:40px 0;}

.search-pop #hd-sch-bar form{display:flex; justify-content: center; flex-wrap: wrap; border:1px solid #515151; background:#fff; border-radius: 45px; height: 55px; width:90%; max-width:520px; display:flex; align-items: center; justify-content: space-between; padding:0 25px}
.search-pop #hd-sch-bar form i{font-size:20px; background:none; color:#9e9e9e}
.search-pop #hd-sch-bar form input{font-size:16px;}
.search-pop #hd-sch-bar form input::placeholder{font-size:16px; color:#9e9e9e;}
.search-pop #hd-sch-bar form button{background:#fff;}

@media (max-width:1680px){/*mobile*/
    .hd-sch-box{border:none; padding:0; border-radius:0; margin-right:45px;}

    .sch-input-view{display:none;}
    .sch-icon-view{display:block}
}



@media (max-width:1200px){/*mobile*/

    .hd-sch-box{margin-right:25px;}

    
}





@media (max-width:768px){/*mobile*/

    #wrap{padding:30px 0;}
    .main-section{padding:30px 0;}
    .main-section.main-section02{padding:60px 0;}
    .main-tit-box h3{font-size:26px}
    .side-quick{width:48px; padding:20px 0; border-radius: 20px 0 0 20px;}
    .side-quick .menu-list a{margin-bottom:10px; font-size:26px;}
}




@media (max-width:410px){/*mobile*/

    .side-quick .menu-list a{margin-bottom:4px; font-size:26px;}
}


.sch-wrap{ padding:40px 0;}
.board-sch form{display:flex; justify-content: center; flex-wrap: wrap;}
.board-sch #sfl{border:1px solid #bbbbbb; border-radius: 45px; height:55px; width:150px; padding:16px; font-size:16px; margin-right:15px; color:#9e9e9e; background: url('../img/select_arrow.png') no-repeat right 20px top 50%; -webkit-appearance:none; -moz-appearance: none; appearance: none; background-size: 11px; }
.board-sch .sch_bar{border:1px solid #bbbbbb; border-radius: 45px; height: 55px; width:100%; max-width:520px; display:flex; align-items: center; justify-content: space-between; padding:0 25px; box-sizing: border-box;}
.board-sch .sch_bar i{font-size:20px; background:none; color:#9e9e9e}
.board-sch .sch_bar input{font-size:16px; width:100%;}
.board-sch .sch_bar input::placeholder{font-size:16px; color:#9e9e9e;}
.board-sch .sch_bar button{background:#fff;}


@media (max-width:768px) {

    .board-sch #sfl{width:100%; height: 45px; margin-right:0; padding:8px 16px; }
    .board-sch .sch_bar{max-width: none; margin-top:10px; }
}


/*footer*/
#footer{background:#2f2f2f; padding:48px 0;}
#footer a{color:#fff; font-size:16px; font-weight:700; display:flex; align-items: center; justify-content: center; height: 100%;}
#footer .contents-box{display:flex; align-items: center; }

#footer .link-list{display:flex; justify-content:center ;}
#footer .link-list .link-contents{margin-right:20px; }
#footer .link-list .link-contents:last-child{margin-right:0; }
#footer .link-list .link-contents img{max-width: 32px;}
#footer .link-list .link-contents i{font-size:32px; color:#cbcccf}
#footer .link-list .link-contents.link01:hover i{color:#fff}
#footer .link-list .link-contents.link02:hover i{color:#ff0032}
#footer .link-list .link-contents.link03:hover i{color:#0766ff}
#footer .link-list .link-contents.link04 .graystyle{display:block}
#footer .link-list .link-contents.link04 .colorstyle{display:none}
#footer .link-list .link-contents.link04:hover .graystyle{display:none}
#footer .link-list .link-contents.link04:hover .colorstyle{display:block}
#footer .link-list .link-contents.link05 .graystyle{display:block}
#footer .link-list .link-contents.link05 .colorstyle{display:none}
#footer .link-list .link-contents.link05:hover .graystyle{display:none}
#footer .link-list .link-contents.link05:hover .colorstyle{display:block}






.ft-info{width:100%; margin:0 0 20px 0;}
.ft-info li{margin-bottom:8px; line-height: 1.4; color:#fff; font-size:15px;}
.ft-info li:last-child{margin-bottom:0;}
.copy{font-size:15px; color:#fff;}

@media (max-width:825px){/*mobile*/
    #footer .contents-box{flex-direction: column; align-items: start; }
    #footer .link-list{margin-bottom:30px; flex-wrap: wrap;}
}


@media (max-width:768px){/*mobile*/

}

/*sub visual*/
.home-en-delete{display:none;}

#sub-visual{position:relative; display:flex; align-items: center; height: 50vw; max-height: 180px;}
#sub-visual .inner{text-align: center;}
#sub-visual .visual-motif{width:76px; height: 12px; background:#fff; position: relative; margin:0 auto 12px;}
#sub-visual .visual-motif::before{content:""; display:block; width:12px; height:26px; background:#fff; position: absolute; left:0; top:0;}
#sub-visual .visual-motif::after{content:""; display:block; width:12px; height:26px; background:#fff; right:0; top:0; position: absolute;}
#sub-visual .visual-title{font-size:38px; color:#000;}

/*snb*/
#snb-wrap{ position:relative; margin-top:-67px}
#snb-wrap .inner{background:#000;}

.snb {margin:0 0 25px 0}
.snb > ul{display:flex; justify-content: center; flex-wrap: wrap; margin:0 -15px;}
.snb > ul > li {width:calc(20% - 30px); margin-right:30px; position: relative;}
.snb > ul > li:last-child {margin-right:0px;}
.snb > ul > li > a {display:flex; height:50px; align-items: center; justify-content: center; font-size:18px; font-weight: 600; border-radius: 16px; color:#92929d; background:#f5f5f7; text-align: center;}
.snb > ul > li > a.active{background:#000; color:#fff;}


.snb.snb05,
.snb.snb06{display:none;}
.en-snb.snb03,
.en-snb.snb04{display:none;}

.category-submenu{position: absolute; width:100%; border:1px solid #f5f5f7; background:#fff; border-radius: 20px; box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.08); display:none;}
.category-submenu a{display:block; text-align: center; font-size:17px; font-weight: 700; padding:10px 5px; color:#a5a5ae}
.category-submenu a:hover{color:#000}
.category-submenu li:first-child a{padding-top:15px;}
.category-submenu li:last-child a{padding-bottom:15px;}


/*sub공통*/
#sub-wrap{padding:0px 0 60px} 
.sub-section{padding:60px 0;}
.sub-page-tit{margin-top:120px}
.sub-page-tit h3{font-size:40px; margin-top:13px;}
.table-container {overflow-x: auto; white-space: nowrap; }
.set-margin-none{margin:0 !important}
.page-navigation{display:flex; align-items: center; margin-top:12px;}
.page-navigation > div{margin-right:24px; font-size:14px; color:#636363; position: relative; }
.page-navigation > div::before{content:""; display:block; width:7px; height: 1px;  background:#636363; position:absolute;right:-16px; top:6px; transform: rotate(45deg);}
.page-navigation > div::after{content:""; display:block; width:7px; height: 1px;  background:#636363; position:absolute; right:-16px; bottom:6px; transform: rotate(-45deg); }
.page-navigation > div:last-child{margin-right:0; }
.page-navigation > div:last-child::before,
.page-navigation > div:last-child::after{display:none;}
.sub-title-motif{width:40px; height: 6px; background:#d2d2d2; position: relative; margin-bottom:20px;}
.sub-title-motif::before{content:""; display:block; width:6px; height:13px; background:#d2d2d2; position: absolute; left:0; top:0;}
.sub-title-motif::after{content:""; display:block; width:6px; height:13px; background:#d2d2d2; right:0; top:0; position: absolute;}
.sub-section-title h4{font-size:32px; }




@media (min-width:1201px){/*mobile*/

    .snb > ul > li:hover .category-submenu {display:block}
}

@media (max-width:1200px){/*mobile*/
    .sub-page-tit h3{font-size:34px;}
    .sub-section-title h4{font-size:29px;}
    #sub-visual .visual-title{font-size:32px;}

    .snb {margin:25px 0}
    .snb > ul{display:flex; justify-content: center; flex-wrap: wrap; margin:0 -5px;}
    .snb > ul > li{width:20%; padding:5px; margin:0;}
    .snb.snb05 li {width:50%;}
    .snb a {display:flex; height:64px; align-items: center; justify-content: center; font-size:20px; font-weight: 600; border-radius: 20px; color:#92929d; background:#f5f5f7 }
    .snb li a.active{background:#000; color:#fff;}

    .category-submenu{display:none;}
    
}

@media (max-width:768px){/*mobile*/

  .sub-page-tit h3{font-size:35px;}
  .snb{height:45px; max-width:100%; width:100%; margin-top:0; }
  .snb a{height: 55px; font-size:18px; border-radius: 12px;}
  .snb-nav .here {color:#fff;}
  .snb-arrow, .snb-arrow:after{background:#fff;}
  .snb-home,
  .route-title{display:none;}
  .visual-sub-title{display:none;}
  #snb-wrap{margin-top:0;}
  #snb-wrap .container{padding:0;}
  .snb > li::after{display:none;}
  .mobile-none{display:none;}
  #sub-visual{max-height: 120px;}
  #sub-visual .visual-title{font-size:28px;}
  .sub-page-tit{margin-top:60px}
  .sub-page-tit h3{font-size:26px;}
  .sub-section-title h4{font-size:22px;}
  .sub-section{padding:30px 0;}
  .snb a{height: 46px; font-size:16px; border-radius: 12px;}
  .snb > ul > li > a{font-size:16px;}
  
}

@media (max-width:672px){/*mobile*/

    .snb > ul > li{width:33.33333%; }
    .snb{height: auto;}

}

@media (max-width:480px){/*mobile*/

    .snb > ul > li > a {font-size:14px;}


}
/* .sub0401 .section01 .contents-box {display:flex; }
.sub0401 .section01 .contents-box > div{width:50%;}
.sub0401 .section01 .left-contents{padding-right:60px;}
.sub0401 .section01 .left-contents p{font-size:21px; font-weight: 300; line-height: 1.7;}
.sub0401 .section01 .left-contents h5{font-size:36px; margin-top:60px; font-weight: 100; font-family: 'Popins', sans-serif; display:inline-block;}
.sub0401 .section01 .left-contents h5::after{content:""; display:block; height: 1px; background:#000; margin-top:0}
.sub0401 .section01 .right-contents{padding-left:60px;}
.sub0401 .section01 .right-contents .info-list{margin-bottom:80px;}
.sub0401 .section01 .right-contents .info-list:last-child{margin-bottom:0px;}
.sub0401 .section01 .right-contents .icon-box{font-size:18px;display:flex; align-items: center; font-weight:700;}
.sub0401 .section01 .right-contents .icon-box .icon{display:flex; align-items: center; justify-content: center; width:40px; height: 40px; background:#f5f5f7; border-radius: 12px;}
.sub0401 .section01 .right-contents .info01{font-size:19px;}
.sub0401 .section01 .right-contents .icon-box .icon{margin-right:16px;}
.sub0401 .section01 .right-contents .info-list p{margin-top:28px; font-size:18px;} */



.sub0401 .section01 .top-contents{margin-bottom:80px;}
.sub0401 .section01 .top-contents p{font-size:21px; font-weight: 300; line-height: 1.7; text-align: center; margin-top:60px;}
.sub0401 .section01 .top-contents iframe{height: 50vw; max-height: 480px;}

.sub0401 .section01 .bottom-contents .inner{display:flex; flex-wrap: wrap;}
.sub0401 .section01 .bottom-contents .info-list{width:25%; text-align: center;}
.sub0401 .section01 .bottom-contents .info-list:last-child{margin-bottom:0px;}
.sub0401 .section01 .bottom-contents .icon-box{font-size:18px; font-weight:700;}
.sub0401 .section01 .bottom-contents .icon-box .icon{display:flex; align-items: center; justify-content: center; width:40px; height: 40px; background:#f5f5f7; border-radius: 12px; margin:0 auto 20px;}
.sub0401 .section01 .bottom-contents .info01{font-size:19px;}
.sub0401 .section01 .bottom-contents .info-list p{margin-top:28px; font-size:17px;}
.sub0401 .section01 .bottom-contents .contact{text-align: center; margin-top:80px;}
/* .sub0401 .section01 .bottom-contents .contact p{font-size:21px; font-weight: 300; line-height: 1.7;}
.sub0401 .section01 .bottom-contents .contact h5{font-size:28px; margin-top:20px; font-weight: 100; font-family: 'Popins', sans-serif; display:inline-block;} */
.sub0401 .section01 .bottom-contents .contact p{margin-top:28px; font-size:18px;}
.sub0401 .section01 .bottom-contents .contact h5{font-size:18px; font-weight:700;}





@media (max-width:980px){/*mobile*/

    .sub0401 .section01 .bottom-contents .info-list{width:50%;}
    .sub0401 .section01 .bottom-contents .info-list:nth-child(3),
    .sub0401 .section01 .bottom-contents .info-list:nth-child(4){margin-top:60px;}

}

@media (max-width:500px){/*mobile*/

    .sub0401 .section01 .bottom-contents .info-list{width:100%; margin-top:60px;}
    .sub0401 .section01 .bottom-contents .info-list:first-child{margin-top:0px;}

}

.sub0501 .section01 .contents-box{text-align:center;}
.sub0501 .section01 .text-contents::before{content:""; display:block; width:90px; height: 1px; background:#000; margin:36px auto;}
.sub0501 .section01 .text-contents h5{font-size:40px;}
.sub0501 .section01 .text-contents h5 span{font-size:28px; display:block;}
.sub0501 .section01 .text-contents p{font-size:18px; line-height: 1.5; margin-top:24px;}
.sub0501 .section02 .contents-box{display:flex; align-items: center;}
.sub0501 .section02 .contents-box > div{width:50%;}
.sub0501 .section02 .img-contents{padding-right:60px;}
.sub0501 .section02 .img-contents .img-box{border:1px solid #ddd; display:flex; align-items: center; justify-content: center; max-height: 340px; height: 50vw; border-radius: 40px;}
.sub0501 .section02 .text-contents h5{font-size:32px;}
.sub0501 .section02 .text-contents p{font-size:19px; line-height: 1.6; color:#797979; margin:32px 0;}
.sub0501 .section02 .text-contents h6{font-size:19px; line-height: 1.6; }


.sub0501 .section03 .text-contents h5{font-size:32px; text-align: center;}
.sub0501 .section03 .text-contents p{font-size:19px; line-height: 1.6; color:#797979; margin:32px 0; text-align: center;}
.sub0501 .section03 .img-contents{background:#f5f5f7; padding:80px; display:flex; align-items: center; border-radius: 40px;}
.sub0501 .section03 .img-contents .img-box{width:50%; text-align: center; }
.sub0501 .section03 .img-contents .img-box img{max-height: 88px;}
.sub0501 .section03 .img-contents .img-box .img01{padding-right:30px;}
.sub0501 .section03 .img-contents .img-box .img02{padding-left:30px;}
.sub0501 .section03 .img-contents .img-box:first-child{padding-right:40px}


.sub0501 .section04 .contents-box{display:flex; align-items: center;}
.sub0501 .section04 .contents-box > div{width:50%;}
.sub0501 .section04 .text-contents{padding-right:60px;}
.sub0501 .section04 .text-contents h5{font-size:32px;}
.sub0501 .section04 .text-contents p{font-size:19px; line-height: 1.6; color:#797979; margin:32px 0;}
.sub0501 .section04 .img-contents{background:#f5f5f7; display:flex; align-items: center; justify-content: center; border-radius: 40px; max-height: 340px; height: 50vw;}
.sub0501 .section04 .img-contents > div{margin-right:160px;}
.sub0501 .section04 .img-contents > div:last-child{margin-right:0px;}


.sub0501 .section05{padding-bottom:120px}
.sub0501 .section05 .text-contents{text-align: center;}
.sub0501 .section05 .text-contents h5{font-size:32px;}
.sub0501 .section05 .text-contents p{font-size:19px; line-height: 1.6; color:#797979; margin:32px 0 44px;}
.sub0501 .section05 .list-contents{display:flex; flex-wrap: wrap; margin:-15px; justify-content: center;}
.sub0501 .section05 .bottom-contents{margin-top:80px;}
.sub0501 .section05 .list-contents > div{width:16.66667%; padding:15px; text-align: center;}
.sub0501 .section05 .list-contents .img-box{background:#f5f5f7; display:flex; align-items: center; justify-content:center; border-radius: 20px; max-height: 143px; height: 50vw; margin-bottom:20px;}
.sub0501 .section05 .list-contents h6{font-size:18px;}
.sub0501 .section05 .list-contents h6 span{font-size:16px; font-weight: 400; display:block}
.sub0501 .section05 .sub-text{margin-top:80px; margin-bottom:0;}
.sub0501 .section05 .text-contents.sub-text p{margin-bottom:0;}

.sub0501 .section06{border-top:1px solid #ddd; padding-top:120px }
.sub0501 .section06 .contents-box{display:flex; align-items: center; }
.sub0501 .section06 .contents-box > div{width:50%; }
.sub0501 .section06 .contents-box .text-contents{padding-right:60px}
.sub0501 .section06 .contents-box .text-contents h5{font-size:32px;}
.sub0501 .section06 .text-contents p{font-size:19px; line-height: 1.6; color:#797979; margin:32px 0;}
.sub0501 .section06 .text-contents .info-contents{display:flex; align-items: center; font-size:18px; margin-bottom:12px}
.sub0501 .section06 .text-contents .info-contents .icon{display:flex; align-items: center; justify-content: center; width:48px; height: 48px; background:#f5f5f7; border-radius: 12px;}
.sub0501 .section06 .text-contents .info-contents .icon i{font-size:20px}
.sub0501 .section06 .text-contents .text{width:calc(100% - 48px); padding-left:12px;}


.sub0501 .section06 .map-box{border:1px solid #ddd}
.sub0501 .section06 .map-box iframe{height: 50vw; max-height:450px}

.sub0501 .section06 .info-contents a{display:flex; align-items: center;}

.sub0501 .section06 .info-contents img{max-width:22px;}
.sub0501 .section06 .link-list .link-contents i{font-size:36px; color:#cbcccf}





.info-group{display: flex; align-items: center;}
.info-group > div{margin-right:60px}
.info-group > div:last-child{margin-right:0}

@media (max-width:1100px){/*mobile*/

    .sub0501 .section05 .list-contents > div{width:50% }
    .sub0501 .section05 .list-contents .img-box{margin-bottom:10px}
  }


@media (max-width:768px){/*mobile*/
    .sub0501 .section01 .text-contents h5{font-size:32px}
    .sub0501 .section01 .text-contents h5 span{font-size:23px}
    .sub0501 .section01 .text-contents p{font-size:16px; text-align: left;}
    
    .sub0501 .section02 .contents-box{flex-wrap: wrap;}
    .sub0501 .section02 .contents-box > div{width:100%;}
    .sub0501 .section02 .img-contents{padding-right:0;}
    .sub0501 .section02 .img-contents .img-box{padding:0 40px; border-radius: 20px;}
    .sub0501 .section02 .contents-box .text-contents{ margin-top:20px}
    .sub0501 .section02 .text-contents h5{font-size:26px;}
    .sub0501 .section02 .text-contents p{margin:24px 0; font-size:16px;}
    .sub0501 .section02 .text-contents h6{font-size:17px;}

    .sub0501 .section03 .text-contents h5{font-size:26px;}
    .sub0501 .section03 .text-contents p{font-size:16px; text-align:left;}
    .sub0501 .section03 .img-contents{padding:40px;}
    .sub0501 .section03 .img-contents .img-box:first-child{padding-right:30px}



    .sub0501 .section04 .contents-box{flex-wrap: wrap;}
    .sub0501 .section04 .contents-box > div{width:100%;}
    .sub0501 .section04 .text-contents{padding-right:0;}
    .sub0501 .section04 .text-contents h5{font-size:26px;}
    .sub0501 .section04 .text-contents p{font-size:16px; margin:24px 0;}
    .sub0501 .section04 .img-contents{padding:40px; height: auto; max-height:none;}
    .sub0501 .section04 .img-contents > div{margin-right:60px}

    .sub0501 .section05{padding-bottom:60px}
    .sub0501 .section05 .text-contents h5{font-size:26px;}
    .sub0501 .section05 .text-contents p{font-size:16px; text-align: left;}
    .sub0501 .section05 .list-contents{margin:-10px}
    .sub0501 .section05 .list-contents > div{width:50% ; padding:10px;}

    .sub0501 .section06{padding-top:60px}
    .sub0501 .section06 .contents-box{flex-wrap: wrap;}
    .sub0501 .section06 .contents-box > div{width:100%;}
    .sub0501 .section06 .contents-box .text-contents{padding-right:0;}
    .sub0501 .section06 .contents-box .text-contents h5{font-size:26px}
    .sub0501 .section06 .text-contents p{font-size:16px;}

    .info-group{flex-direction: column; align-items: flex-start}
    .sub0501 .section06 .text-contents .info-contents{font-size:16px}
    .sub0501 .section06 .text-contents p{margin:24px 0}
}

  @media (max-width:360px){/*mobile*/

    .sub0501 .section045 .list-contents > div{width:100% }
  }



.ready-page{background:#f5f5f7; max-height: 500px; height: 50vw; display:flex; flex-direction: column; align-items:center; justify-content:center;}
.ready-page h5{font-size:40px; }
.ready-page i{font-size:50px; margin-bottom:30px; color:#147bd1}

/* 1. PC 버전 설정 (화면 너비 1024px 이상일 때) */
@media (min-width: 1024px) {
    /* 부모 박스: 요소들을 세로 중앙으로 정렬 */
    .index .main-section01 .lat-book .main-book-info .inner {
        display: flex !important;
        align-items: center !important; /* 하단 고정 해제 -> 중앙 고정 */
        max-width: none !important;
    }

    /* 이미지 박스 영역을 260px로 절대 고정 및 높이 설정 */
    .index .main-section01 .lat-book .main-book-info .img-box {
        width: 260px !important;
        min-width: 260px !important;
        max-width: 260px !important;
        flex: 0 0 260px !important; 
        height: 380px !important; /* 전체 틀 높이 유지 */
        display: flex !important;
        align-items: center !important; /* 이미지를 박스 세로 중앙에 배치 */
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 이미지 자체 설정 */
    .index .main-section01 .lat-book .main-book-info .img-box img {
        display: block !important;
        width: 100% !important;   /* 가로 260px 꽉 채움 */
        height: auto !important;  /* 비율 유지 */
        max-height: 100% !important;
        object-fit: contain !important;
    }

    /* 우측 텍스트 영역: 이미지와 높이를 맞춰 위치 고정 및 중앙 정렬 */
    .index .main-section01 .lat-book .main-book-info .book-info-view {
        flex: 1 !important;
        padding-left: 50px !important;
        height: 380px !important; /* 이미지 박스와 높이 통일 */
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important; /* 텍스트도 세로 중앙 정렬 */
        min-width: 0 !important;
    }
}

/* 2. 모바일 버전 설정 (비례 유지 + 여백 완전 제거 + 왼쪽 정렬) */
@media (max-width: 1023px) {
    .index .main-section01 .lat-book .main-book-info .inner {
        display: block !important;
        text-align: left !important;
    }

    .index .main-section01 .lat-book .main-book-info .img-box {
        /* 핵심: 박스 너비를 이미지의 '실제 비례 너비'에 딱 맞춤 */
        display: table !important; 
        width: auto !important; 
        max-width: 260px !important; /* 모바일 최대 너비 제한 */
        height: auto !important;
        margin: 0 0 20px 0 !important; /* 왼쪽 정렬 및 하단 여백 */
        background-color: transparent !important;
        padding: 0 !important;
    }

    .index .main-section01 .lat-book .main-book-info .img-box a {
        display: block !important;
        width: 100% !important;
    }

    .index .main-section01 .lat-book .main-book-info .img-box img {
        display: block !important;
        /* 부모 박스(img-box)에 꽉 차게 설정 */
        width: 100% !important; 
        height: auto !important; /* 원본 비례 유지 */
        
        /* 절대 왜곡하지 않고 박스에 맞춤 */
        object-fit: contain !important; 
        max-width: none !important;
    }

    /* 텍스트 영역 설정 */
    .index .main-section01 .lat-book .main-book-info .book-info-view {
        display: block !important;
        width: 100% !important;
        padding-left: 0 !important;
        text-align: left !important;
        height: auto !important;
    }

    .index .main-section01 .lat-book .main-book-info .book-info-view * {
        text-align: left !important;
    }
}