@charset "utf-8";

/* ***** font ***** */
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard ExtraLight'), url('./fonts/Pretendard-ExtraLight.subset.woff2') format('woff2'), url('./fonts/Pretendard-ExtraLight.subset.woff') format('woff');
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard Light'), url('./fonts/Pretendard-Light.subset.woff2') format('woff2'), url('./fonts/Pretendard-Light.subset.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard Regular'), url('./fonts/Pretendard-Regular.subset.woff2') format('woff2'), url('./fonts/Pretendard-Regular.subset.woff') format('woff');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard Medium'), url('./fonts/Pretendard-Medium.subset.woff2') format('woff2'), url('./fonts/Pretendard-Medium.subset.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard SemiBold'), url('./fonts/Pretendard-SemiBold.subset.woff2') format('woff2'), url('./fonts/Pretendard-SemiBold.subset.woff') format('woff');
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard Bold'), url('./fonts/Pretendard-Bold.subset.woff2') format('woff2'), url('./fonts/Pretendard-Bold.subset.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: local('Pretendard ExtraBold'), url('./fonts/Pretendard-ExtraBold.subset.woff2') format('woff2'), url('./fonts/Pretendard-ExtraBold.subset.woff') format('woff');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'SEBANG_Gothic_Bold';
	src: url('./fonts/SEBANG_Gothic_Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* ***** reset ***** */
*{-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(255,255,255,0);}
body{-webkit-font-smoothing:antialiased;font-family:'Pretendard', sans-serif;font-size:16px;font-weight:400;color:#666;word-break:keep-all;word-wrap:break-word;}
body,p,h1,h2,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,pre{margin:0;padding:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
ul,ol,li{display:block;list-style:none;}
img{border:0px none;max-width:100%;transition-duration:0.3s;}
img,input,button,label,select{vertical-align:middle;}
input[type='submit'],input[type='button'],button{cursor:pointer;overflow:visible;}
i,em,address{font-style:normal;}
a{text-decoration:none;color:#000;}
a:hover{text-decoration:none;}
table{border-spacing:0;table-layout:fixed;width:100%;}
table table{width:auto;}
caption{overflow:hidden;width:1px;height:1px;padding:0;margin-top:-1px;font-size:0;line-height:0;text-indent:-9999px;}

/* ***** size ***** */
.w10{width:10px}.w15{width:15px}.w20{width:20px}.w25{width:25px}.w30{width:30px}.w35{width:35px}.w40{width:40px}.w45{width:45px}.w50{width:50px}
.w55{width:55px}.w60{width:60px}.w65{width:65px}.w70{width:70px}.w75{width:75px}.w80{width:80px}.w85{width:85px}.w90{width:90px}.w95{width:95px}.w100{width:100px}
.w110{width:110px}.w120{width:120px}.w130{width:130px}.w140{width:140px}.w150{width:150px}.w160{width:160px}.w170{width:170px}.w180{width:180px}.w190{width:190px}.w200{width:200px}
.w210{width:210px}.w220{width:220px}.w230{width:230px}.w240{width:240px}.w250{width:250px}.w260{width:260px}.w265{width:265px}.w270{width:270px}.w280{width:280px}.w290{width:290px}.w300{width:300px}
.w310{width:310px}.w320{width:320px}.w330{width:330px}.w340{width:340px}.w350{width:350px}.w360{width:360px}.w370{width:370px}.w380{width:380px}.w390{width:390px}.w400{width:400px}.w450{width:450px}
.w1p{width:1%}.w2p{width:2%}.w3p{width:3%}.w4p{width:4%}.w5p{width:5%}.w6p{width:6%}.w7p{width:7%}.w8p{width:8%}.w9p{width:9%}.w10p{width:10%}
.w11p{width:11%}.w12p{width:12%}.w13p{width:13%}.w14p{width:14%}.w15p{width:15%}.w16p{width:16%}.w17p{width:17%}.w18p{width:18%}.w19p{width:19%}.w20p{width:20%}
.w21p{width:21%}.w22p{width:22%}.w23p{width:23%}.w24p{width:24%}.w25p{width:25%}.w26p{width:26%}.w27p{width:27%}.w28p{width:28%}.w29p{width:29%}.w30p{width:30%}
.w31p{width:31%}.w32p{width:32%}.w33p{width:33%}.w34p{width:34%}.w35p{width:35%}.w36p{width:36%}.w37p{width:37%}.w38p{width:38%}.w39p{width:39%}.w40p{width:40%}
.w41p{width:41%}.w42p{width:42%}.w43p{width:43%}.w44p{width:44%}.w45p{width:45%}.w46p{width:46%}.w47p{width:47%}.w48p{width:48%}.w49p{width:49%}.w50p{width:50%}
.w55p{width:55%}.w60p{width:60%}.w65p{width:65%}.w70p{width:70%}.w75p{width:75%}.w80p{width:80%}.w85p{width:85%}.w90p{width:90%}.w95p{width:95%}.w100p{width:99.9%}
.h50{height:50px}.h100{height:100px}.h150{height:150px}.h200{height:200px}.h250{height:250px}.h300{height:300px}.h350{height:350px}.h400{height:400px}.h450{height:450px}.h500{height:500px}

/* ***** common ***** */
.inner{display:block;margin:0 auto;padding:0 15px;max-width:1210px;box-sizing:border-box;}
.sound-only{display:block !important;position:absolute !important;top:-9999px !important;}
.mobile-only{display:none !important;}
.txt-left{text-align:left !important;}
.txt-center{text-align:center !important;}
.txt-right{text-align:right !important;}
.swiper-button-prev,
.swiper-button-next{margin-top:0;text-indent:-9999px;border:none;}
.swiper-button-start,
.swiper-button-stop{text-indent:-9999px;border:none;}
.va-top{vertical-align:top !important;}
.va-middle{vertical-align:middle !important;}
.va-bottom{vertical-align:bottom !important;}
.keep-all{word-break:keep-all !important;}
.txt-yellow{color:#b78601 !important;}
.txt-orange{color:#e55d0c !important;}

/* ***** form ***** */
input[type='text'],input[type='password'],input[type='number'], button, select, textarea{-webkit-appearance:none;appearance:none;font-family:'Pretendard', sans-serif;font-size:16px;color:#111;background:transparent;border:none;border-radius:0;box-sizing:border-box;}
input[type='submit']{-webkit-appearance:none;appearance:none;font-family:'Pretendard', sans-serif;box-sizing:border-box;}
input[type='text'],input[type='password'],input[type='number']{padding:0 16px;height:48px;max-width:100%;background:#fff;border:1px solid #ccc;border-radius:4px;}
select{padding:0 40px 0 16px;min-width:70px;height:48px;max-width:100%;background:#fff url('../images/common/ico_sel.png') no-repeat right 20px center;border:1px solid #ccc;border-radius:4px;}
textarea{padding:0 16px;width:99.9%;background:#fff;border:1px solid #ccc;resize:vertical;box-sizing:border-box;border-radius:5px;}
*:disabled{color:#3a3a3a !important;background:#f8f8f8 !important;}
*.disabled{color:#3a3a3a !important;background:#f8f8f8 !important;}
input.readonly{color:#3a3a3a !important;background:#f8f8f8 !important;}
input[type='text']:-moz-read-only{color:#3a3a3a !important;background:#f8f8f8 !important;}
input[type='text']:read-only{color:#3a3a3a !important;background:#f8f8f8 !important;}
input[type='text']:focus,
input[type='password']:focus,
input[type='number']:focus,
input[type='file']:focus,
select:focus,
textarea:focus{outline-color:#4142a5;}
input::placeholder{font-weight:400;font-size:16px;color:#ccc;}
#for_file{display:block;position:relative;}
#for_file .btn-file{display:inline-block;position:absolute;left:16px;top:7px;width:64px;height:36px;line-height:36px;font-weight:600;font-size:16px;color:#111;text-align:center;}
#for_file .btn-file:hover{color:#4142a5;background:#f5f5fa;}
#for_file input{padding-left:89px;}
#for_file input::placeholder{color:#111;}

input[type="checkbox"]{-webkit-user-select:initial;user-select:initial;-webkit-appearance:none;appearance:none;position:relative;width:16px;min-height:24px;background:transparent !important;border:transparent !important;}
input[type="checkbox"]:before{display:block;content:'';position:absolute;left:0;top:3px;width:16px;height:16px;background:url('../images/common/ico_chk.png') no-repeat center;}
input[type="checkbox"]:checked:before{background:url('../images/common/ico_chk_on.png') no-repeat center;}
input[type="checkbox"] + label{margin-left:7px;line-height:24px;}
input[type="checkbox"]:disabled:before{opacity:0.7;}
input[type="checkbox"]:disabled:after{display:block;content:'';position:absolute;left:0;top:50%;margin-top:-8px;width:16px;height:16px;background:#d9d9d9;opacity:0.3;border-radius:5px;}

input[type="radio"] + label{margin-left:7px;}

/* ***** layout ***** */
#skip a{display:block;position:fixed;left:0;top:-50px;width:200px;height:50px;line-height:50px;font-size:20px;color:#fff;text-align:center;background:#1467c3;}
#skip a:focus{top:0;z-index:9999;}
#header{position:fixed;left:0;right:0;top:0;height:90px;background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.25);z-index:100;}
#header > .inner{display:flex;height:100%;align-items:center;justify-content:space-between;}
#header .logo a{display:block;}
#header .logo img{height:48px;}
#gnb{display:flex;justify-content:center;align-items:center;height:100%;}
#gnb .menu{display:flex;}
#gnb .menu > li > a{display:block;position:relative;width:140px;height:42px;line-height:42px;font-size:18px;color:#000;text-align:center;transition-duration:0.3s;}
#gnb .menu > li > a:hover{font-weight:600;color:#4142a5;}
#gnb .menu > li.last{margin-left:42px;}
#gnb .menu > li.last > a{color:#fff;background:#4142a5;border-radius:4px;}
#gnb .menu > li.last > a:hover{background:#2d2e7f;}
#header .btn-menu{display:none;position:fixed;right:0;top:0;width:60px;height:60px;}
#header .btn-menu span{display: block;height:3px;width:50%;text-indent:-9999px;background:#111;margin-bottom:6px;border-radius:2px;transition:0.3s;}
#header .btn-menu span:last-child{margin-bottom:0;}

#container{min-height:768px;}

#footer{padding:122px 0 115px;color:#fff;background:#031637;}
#footer > .inner{display:flex;justify-content:space-between;}
#footer .left{display:flex;gap:10px;flex-shrink:0;line-height:1.5em;}
#footer .f-logo{flex-shrink:0;}
#footer .f-logo img{height:70px;}
#footer .center{width:120px;}
#footer .center b{display:block;margin-bottom:11px;font-weight:600;}
#footer .f-menu{display:flex;flex-wrap:wrap;gap:0 22px;}
#footer .f-menu > li > a{font-size:14px;color:#fff;line-height:32px;}
#footer .f-menu > li > a:hover{font-weight:600;}
#footer .right{text-align:right;}
#footer .f-sns{display:flex;justify-content:flex-end;gap:18px;margin-bottom:40px;}
#footer .f-sns > li > a{display:block;width:32px;height:32px;text-align:left;text-indent:-9999px;background:url('../images/common/ico_sns1.png') no-repeat center;transition-duration:0.3s;}
#footer .f-sns > li.item2 > a{background-image:url('../images/common/ico_sns2.png');}
#footer .f-sns > li.item3 > a{background-image:url('../images/common/ico_sns3.png');}
#footer .f-sns > li > a:hover{background-image:url('../images/common/ico_sns1_on.png');}
#footer .f-sns > li.item2 > a:hover{background-image:url('../images/common/ico_sns2_on.png');}
#footer .f-sns > li.item3 > a:hover{background-image:url('../images/common/ico_sns3_on.png');}
#footer .f-link{display:flex;justify-content:flex-end;gap:28px;margin-bottom:17px;}
#footer .f-link > li > a{font-size:14px;color:#fff;}
#footer .f-link > li > a:hover{font-weight:600;}
#footer .right p{font-size:14px;color:#ccc;}

#overlay{display:none;position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.3);z-index:99;}

.tab-page{display:none;}
.tab-page.active{display:block;}

#btnTop{display:block;position:fixed;right:40px;bottom:40px;width:50px;height:50px;text-indent:-9999px;background:#4142a5 url('../images/common/ico_top.png') no-repeat center / auto 12px;border-radius:8px;transform:scale(0);transition-duration:0.2s;z-index:99;}
#btnTop.active{transform:scale(1);}
#btnTop:hover{background-color:#2d2e7f;box-shadow: 1px 1px 10px rgba(0,0,0,0.05);}

/* ***** main ***** */
.title-area{margin-bottom:42px;text-align:center;}
.title-area em{display:block;margin-bottom:17px;font-weight:700;font-size:14px;color:#4142a5;font-family:'SEBANG_Gothic_Bold';text-transform:uppercase;}
.title-area .title{margin-bottom:21px;font-weight:600;font-size:42px;color:#111;}
.title-area p{color:#666;line-height:1.5em;}

#visualSlider li{height:841px;box-sizing:border-box;}
#visualSlider li a{display:block;height:100%;}
#visualSlider li .bg{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;}
#visualSlider li .bg:before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.3);}
#visualSlider li.swiper-slide-active .bg{animation:mainBg 8s 0s both;}
#visualSlider li .txt-grp{display:flex;flex-direction:column;justify-content:center;position:absolute;top:90px;bottom:0;left:0;right:0;margin:0 auto;padding:0 15px;width:1210px;box-sizing:border-box;}
#visualSlider li .txt-grp > .txt-wrap{display:block;overflow:hidden;vertical-align:top;}
#visualSlider li .txt-grp > .txt-wrap.txt1{margin-bottom:29px;}
#visualSlider li .txt-grp > .txt-wrap > span{display:block;font-size:18px;color:#fff;line-height:1.5em;transform:translateY(50px);opacity:0;transition:transform 0.7s ease-in-out, opacity 0.7s ease-in-out;transition-delay:0.15s;}
#visualSlider li .txt-grp > .txt-wrap.txt1 > span{font-size:64px;line-height:1.3em;}
#visualSlider li a:hover img{transform:scale(1) !important;}
#visualSlider li.swiper-slide-active .txt-grp > .txt-wrap > strong,
#visualSlider li.swiper-slide-active .txt-grp > .txt-wrap > span{transform:translateY(0);opacity:1;}
#visualSlider > button{width:88px;height:88px;}
#visualSlider .swiper-button-prev{left:calc(50% - 737px);margin-top:-44px;background-image:url('../images/main/ico_prev.png');background-size:auto 29px;}
#visualSlider .swiper-button-next{right:calc(50% - 737px);margin-top:-44px;background-image:url('../images/main/ico_next.png');background-size:auto 29px;}
#visualSlider .swiper-pagination{display:inline-block;position:static;vertical-align:middle;}
#visualSlider .swiper-pagination-bullet{position:relative;margin:0;padding:0 10px;width:auto;height:33px;line-height:33px;font-family: 'SBAggro';font-weight:500;font-size:19px;color:#fff;background:transparent;opacity:1;box-sizing:border-box;}
#visualSlider .swiper-pagination-bullet:before{display:block;content:'';position:absolute;left:60px;top:50%;margin-top:-1px;width:0;height:1px;background:rgba(255,255,255,0.4);}
#visualSlider .swiper-pagination-bullet:after{display:block;content:'';position:absolute;left:60px;top:50%;margin-top:-1px;width:0;height:1px;background:rgba(255,255,255,1);z-index:2;}
#visualSlider .swiper-pagination-bullet-active{padding-right:100px;background:transparent;}
#visualSlider .swiper-pagination-bullet-active:before{width:60px;}
#visualSlider .swiper-pagination-bullet-active:after{animation:mainLine 8s ease 0s both;}
#visualSlider .swiper-auto{display:inline-block;position:relative;vertical-align:middle;}
#visualSlider .swiper-auto > button{display:inline-block;width:33px;height:33px;text-indent:-9999px;background-size:auto 20px;border:1px solid rgba(255,255,255,0.4);border-radius:50%;box-sizing:border-box;z-index:10;}
#visualSlider .swiper-auto .swiper-button-stop{background:url('/images/main/ico_visual_stop.png') no-repeat center;}
#visualSlider .swiper-auto .swiper-button-start{display:none;background:url('/images/main/ico_visual_start.png') no-repeat center;}
#visualSlider.active .swiper-auto .swiper-button-stop{display:none;}
#visualSlider.active .swiper-auto .swiper-button-start{display:block;}

@keyframes mainBg{
	from{transform:scale(1.1);}
	to{transform:scale(1);}
}

@keyframes mainLine{
	from{width:0px;}
	to{width:60px;}
}

.main-section2{position:relative;padding:55px 0 112px;}
.main-section2:before{content:'';position:absolute;top:0;bottom:-135px;left:calc(50% + 63px);right:0;background:url('../images/main/bg_mainsection2.svg') no-repeat left center;z-index:-1;}
.main-section2 .con{width:630px;}
.main-section2 em{display:block;margin-bottom:28px;font-weight:700;font-size:14px;color:#4142a5;font-family:'SEBANG_Gothic_Bold';text-transform:uppercase;}
.main-section2 .title{display:block;position:relative;margin-bottom:15px;padding-bottom:43px;font-weight:600;font-size:42px;color:#111;}
.main-section2 .title:after{content:'';position:absolute;bottom:0;left:0;width:50px;height:1px;background:#4142a5;}
.main-section2 p{margin-bottom:15px;color:#666;line-height:1.5em;}
.main-section2 .btn.line{position:relative;padding:5px 15px 5px 20px;font-size:16px;}
.main-section2 .btn.line:after{content:'';margin-left:15px;width:33px;height:6px;background:url('../images/main/ico_arrow.png') no-repeat left center;transition-duration:0.3s;}
.main-section2 .btn.line:hover{color:#666;border-color:#4142a5;}
.main-section2 .btn.line:hover:after{background-image:url('../images/main/ico_arrow_on.png');}

.main-section3{padding:100px 0 116px;background:#f5f5fa;}
.main-section3 .btn-area{margin:0;}
.main-product{display:flex;gap:20px;margin-bottom:42px;}
.main-product li{flex:1;}
.main-product li a{display:block;position:relative;padding:42px 18px 39px;height:320px;background:#fff;box-shadow:2px 2px 8px rgba(0,0,0,0.25);transition-duration:0.8s;box-sizing:border-box;}
.main-product li a:before{content:'';position:absolute;left:168px;right:0;top:0;bottom:0;background:url('../images/main/bg_mainproduct1.jpg') no-repeat center;transition-duration:0.8s;}
.main-product li.item2 a:before{background-image:url('../images/main/bg_mainproduct2.jpg');}
.main-product li.item3 a:before{background-image:url('../images/main/bg_mainproduct3.jpg');}
.main-product li .title{display:block;margin-bottom:16px;font-weight:700;font-size:24px;color:#111;position:relative;z-index:2;}
.main-product li .desc{display:block;position:relative;margin-bottom:21px;padding-bottom:20px;color:#666;line-height:1.5em;z-index:2;}
.main-product li .desc:before{content:'';position:absolute;left:0;bottom:0;width:38px;height:1px;background:#4142a5;}
.main-product li .tag{display:block;margin-bottom:30px;font-weight:600;color:#111;line-height:1.5em;position:relative;z-index:2;}
.main-product li .view{display:inline-block;position:relative;line-height:25px;font-size:16px;color:#ccc;border-bottom:2px solid #ccc;position:relative;z-index:2;}
.main-product li .view:after{content:'';position:absolute;right:2px;bottom:-15px;width:12px;height:12px;border-right:2px solid transparent;border-bottom:2px solid transparent;transform:translateY(-50%) rotate(-45deg);transition-duration:0.3s;}
.main-product li a:hover{width:580px;}
.main-product li a:hover:before{left:0;}
.main-product li a:hover .title,
.main-product li a:hover .desc,
.main-product li a:hover .tag,
.main-product li a:hover .view{color:#fff;}
.main-product li a:hover .desc:before{width:80px;background:#fff;}
.main-product li a:hover .view{padding-right:20px;color:#fff;border-color:#fff;}
.main-product li a:hover .view:after{border-right:2px solid #fff;}

.main-section4{position:relative;padding:172px 0 162px;}
.main-section4:before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:url('../images/main/bg_mainsection4.png') no-repeat left center / cover;z-index:-1;}
.main-section4 .title-area em,
.main-section4 .title-area .title,
.main-section4 .title-area p{color:#fff;}
.main-feature{display:flex;gap:20px;}
.main-feature > li{position:relative;flex:1;transition-duration:0.3s;}
.main-feature > li:before{content:'';position:absolute;left:9px;right:-9px;top:9px;bottom:-9px;background:transparent;transition-duration:0.3s;}
.main-feature > li a{display:block;position:relative;padding:28px 20px;min-height:280px;text-align:center;background:#fff;box-shadow:2px 2px 8px rgba(0,0,0,0.25);box-sizing:border-box;}
.main-feature > li:hover{transform:translate(-9px,-9px);}
.main-feature > li:hover:before{background:#4142a5;}

.main-feature > li i{display:inline-block;position:relative;margin-bottom:12px;width:90px;height:90px;line-height:90px;text-align:center;}
.main-feature > li i:before{content:'';position:absolute;width:42px;height:42px;background:#f5f5fa;border-radius:50%;}
.main-feature > li.item1 i:before{left:-10px;top:-10px;}
.main-feature > li.item2 i:before{right:-10px;bottom:-10px;}
.main-feature > li.item3 i:before{left:-10px;bottom:10px;}
.main-feature > li.item4 i:before{left:-10px;bottom:5px;}
.main-feature > li i img{position:relative;z-index:3;}
.main-feature > li .title{display:block;margin-bottom:10px;font-weight:700;font-size:24px;color:#000;line-height:46px;}
.main-feature > li span{display:block;font-size:14px;color:#666;line-height:1.5em;}

.main-section5{padding:85px 0 118px;}
.main-section6{padding:100px 0 95px;background:#f5f5fa;}
.main-section6 .title-area{margin-bottom:50px;}
.main-section6 .inner{display:flex;gap:30px;}
.main-section6 .left{padding:20px 25px 0;width:580px;background:#fff;border-radius:8px;box-shadow:0px 0px 4px rgba(0,0,0,0.25);box-sizing:border-box;}
.main-section6 .right{width:570px;}
.main-section6 .right > div{background:#fff;border-radius:8px;box-shadow:0px 0px 4px rgba(0,0,0,0.25);overflow:hidden;}

.notice-content .tab-bar{display:flex;align-items:center;gap:21px;padding-bottom:14px;border-bottom:2px solid #000;}
.notice-content .tab-bar li a{display:block;font-weight:600;font-size:20px;color:#999;line-height:1.05em;}
.notice-content .tab-bar li.active a{font-weight:700;font-size:24px;color:#111;}
.notice-content .btn-more{display:block;position:absolute;right:0;top:-64px;width:48px;height:48px;text-indent:-9999px;background:#eee url('../images/main/ico_more.png') no-repeat center;border-radius:50%;}
.notice-content .tab-page{position:relative;}
.notice-content .tab-page .list > li{display:flex;align-items:center;justify-content:space-between;gap:20px;height:54px;border-bottom:1px solid #ccc;}
.notice-content .tab-page .list > li:last-child{border-bottom:none;}
.notice-content .tab-page .list > li .title{display:block;flex-grow:1;color:#666;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.notice-content .tab-page .list > li .title:hover{font-weight:600;color:#4142a5;}
.notice-content .tab-page .list > li .date{flex-shrink:0;width:90px;font-size:14px;color:#666;}
.notice-content .tab-page .list > li.empty{display:flex;align-items:center;justify-content:center;width:100%;height:270px;font-size:20px;text-align:center;}

.qna-info{margin-bottom:20px;padding:20px 23px;}
.qna-info .h3-title{margin-bottom:12px;font-weight:700;font-size:24px;color:#111;}
.qna-info strong{display:block;position:relative;margin-bottom:14px;padding-bottom:19px;font-weight:600;font-size:36px;color:#4142a5;}
.qna-info strong:after{content:'';position:absolute;left:0;bottom:0;width:46px;height:1px;background:#4142a5;}
.qna-info p{line-height:1.5em;}
.qna-link a{display:block;position:relative;padding:0 56px;height:110px;line-height:110px;text-align:right;background:url('../images/main/bg_qna_link.png') no-repeat left center / cover;}
.qna-link a:before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:#2d2e7f;opacity:0.8;transition-duration:0.3s;}
.qna-link a span{position:relative;font-weight:600;font-size:20px;color:#fff;}
.qna-link a span:after{content:'';display:inline-block;margin-left:10px;width:30px;height:20px;background:url('../images/main/ico_arrow2.png') no-repeat center;}
.qna-link a:hover:before{opacity:0.9;}



/* 팝업 오버레이 (배경) */
.popup-overlay {
    display: none; /* 기본적으로 숨김 */
    position: fixed; /* 화면에 고정 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* 어두운 배경 */
    display: flex; /* 내용을 중앙에 정렬 */
    justify-content: center;
    align-items: center;
    z-index: 1000; /* 다른 요소 위에 표시 */
}

/* 팝업 내용 */
.popup-content {
    background-color: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    text-align: center;
    max-width: 600px; /* 상세 내용을 위해 너비 약간 증가 */
    width: 90%; /* 반응형 너비 */
    position: relative;
    max-height: 80vh; /* 최대 높이 설정 */
    overflow-y: auto; /* 내용이 길어질 경우 스크롤 */
}

.popup-content h2 {
    color: #333;
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 2em;
}

.popup-content p#popupDate { /* 날짜 스타일 */
    color: #999;
    font-size: 0.9em;
    margin-bottom: 20px;
}

.popup-content div#popupContent { /* 상세 내용 스타일 */
    text-align: left; /* 상세 내용은 왼쪽 정렬 */
    color: #444;
    line-height: 1.8;
    margin-bottom: 30px;
    font-size: 1.1em;
}

.popup-content button {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s ease;
}

.popup-content button:hover {
    background-color: #0056b3;
}