@charset "utf-8";
/* ********************************************************************
 * name : ARML
 * filename : content.css
 * author : JBieN Á¦À̺ñ¿£
 * date : 2025-10-27
********************************************************************* */

/* === Mission === */
.sMission{position: relative;}
.sMission:after{content: '';background: #f9f9f9;width: 300%;height: 300%;position: absolute;top: -100%;left: -100%;z-index: -10;}
.sMissionWrap{position: relative;}
.sMissionWrap .misTitle{color: #393b42;font-size: 5rem;font-weight: 300;line-height: 1.2;}
.sMissionWrap .misTitle span{color: #a9c9e3;}
.sMissionWrap .sMissionBox{display: flex;justify-content: center;padding: 8em 0;align-items: center;}
.sMissionWrap .sMissionBox .imgBox{margin-right: 7em;position: relative;}
.sMissionWrap .sMissionBox .imgBox img{}
.sMissionWrap .sMissionBox .txtBox{}
.sMissionWrap .sMissionBox .txtBox .gradientCircle{position: absolute;width: 650px;height: 850px;top: 50%;left: 70%;transform: translate(-50%, -50%);border-radius: 50%;background: radial-gradient(circle, rgb(1 44 135 / 29%) 0%, rgba(150, 200, 255, 0.4) 40%, rgba(220, 240, 255, 0.1) 70%, transparent 100%);filter: blur(120px);opacity: 1;z-index: -1;pointer-events: none;animation: floatAround 40s ease-in-out infinite alternate;}
.sMissionWrap .sMissionBox .txtBox .con{line-height: 1.8;font-size: 1.4rem;color: #7d838d;}
.sMissionWrap .sMissionBox .txtBox .con p:last-child{color: #071d45;margin-top: 3em;}
.sMissionWrap .sMissionBox .txtBox .waterMark{margin: 4em 0 0 -9em;}
.sMissionWrap .sMissionBox .txtBox .waterMark img{}

.sMissionTab .misTabTitle{text-align: center;font-size: 4.8rem;font-weight: 300;width: 100%;color: #393b42;line-height: 1.2;margin: 1em 0;}
.sMissionTab .misTabTitle span{display: block;position: relative;font-size: 2rem;width: 270px;margin: 0 auto;}
.sMissionTab .misTabTitle span:after{content:'';position: absolute;width: 7px;height: 7px;background: #393b42;border-radius: 50%;left: 0;top: 50%;margin-top: -3.5px;}
.misTabWrap {display: flex;overflow: hidden;margin-bottom: 5em;gap: 2em;height: 430px;}
.misTabWrap .misImgBox {position: relative;flex: 1;overflow: hidden;background: #000;border-radius: 2em;}
.misTabWrap .misImgBox img {position: absolute;inset: 0;width: 100%;height: 100%;object-fit: cover;object-position: center center;opacity: 0;transition: opacity 1s ease-in-out;pointer-events: none;transform: none !important;will-change: opacity;}
.misTabWrap .misImgBox img.active {opacity: 1;}
.misTabWrap .txtBox {flex: 1;display: flex;flex-direction: column;justify-content: center;height: 430px;}
.misTabWrap .tabItem {border-radius: 2em;/* margin-bottom: 12px; */background: white;box-shadow: 0 0 0 1px #eee;overflow: hidden;height: 430px;display: flex;flex-direction: column;justify-content: center;}
.misTabWrap .tabItem.active {/* padding: 5em 0; */position: relative;}
.misTabWrap .tabItem button {width: 100%;background: none;border: none;text-align: left;font-size: 2.4rem;padding: 0.8em 2em;cursor: pointer;display: flex;align-items: center;gap: 12px;transition: background 0.3s;cursor: text;}
.misTabWrap .tabItem .con {max-height: 0;overflow: hidden;padding: 0 4.5em;font-size: 1.25rem;color: #7d838d;font-weight: 300;line-height: 1.6;opacity: 0;transition: all 0.5s ease;}
.misTabWrap .tabItem.active .con {max-height: 430px;padding: 1em 4.5em;opacity: 1;}
.misTabWrap .tabItem.active .con::after{content: '';background: url(./../img/content/arml_icon.png) no-repeat center;width: 31px;height: 24px;position: absolute;top: 2em;right: 2em;background-size: cover;}
.sMissionTab.last{margin-bottom: 0;}


/* === History === */
.sHistory{display: flex;justify-content: space-between;align-items: flex-start;gap: 7em;}
.sHistory .timeline{flex: 1;}
.sHistory .timeline .timeBox{display: flex;justify-content: space-between;align-items: center;border-bottom: 1px solid #dddddd;padding-bottom: 3em;margin-top: 3em;}
.sHistory .timeline .timeBox:first-child{margin-top: 0;}
.sHistory .timeline .timeBox .year{width: 127px;font-size: 1.6em;color: #393c43;position: relative;padding-left: 40px;}
.sHistory .timeline .timeBox .year::after{content:'';width: 8px;height: 8px;background: #393c43;position: absolute;border-radius: 50%;left: 0;top: 50%;margin-top: -4px;}
.sHistory .timeline .timeBox .month{flex: 1;}
.sHistory .timeline .timeBox .month dl{display: flex;gap: 3em;align-items: center;margin: 1.5em 0;}
.sHistory .timeline .timeBox .month dl dt{width: 86px;font-size: 1.25rem;background: #0a2960;color: #fff;text-align: center;padding: 0.2em 0;border-radius: 30px;}
.sHistory .timeline .timeBox .month dl dd{font-size: 1.35rem;flex: 1;color: #6e727f;}
.sHistory .imgWrap{width: 429px;}
.sHistory .imgWrap .imgBox{}
.sHistory .imgWrap .imgBox .img{width: 100%;max-height: 280px;overflow: hidden;border-radius: 30px;}
.sHistory .imgWrap .imgBox .img img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.sHistory .imgWrap .imgBox span{background: #afcde9;width: 100%;display: block;padding: 0.5em 0;text-align: center;color: #fff;border-radius: 50px;font-size: 1.25rem;margin: 4px 0;}


/* === Location === */
.sLocation{display: flex;justify-content: space-between;gap: 5em;align-items: center;}
.sLocation .mapBox{}
.sLocation .mapBox iframe{width: 720px;height: 525px;}
.sLocation .locaBox {flex: 1;display: flex;flex-direction: column;align-items: center;}
.sLocation .locaBox .contact .contact-item{margin-bottom: 1em;display: flex;align-items: center;color: #675f5f;font-size: 1.125rem;font-weight: 300;}
.sLocation .locaBox .contact .contact-item i{background: #eaf3fc;padding: 0.5em;border-radius: 10px;font-size: 1.25rem;margin-right: 1em;color: #2192ce;}
.sLocation .locaBox .contact .contact-item span{font-size: 1.25rem;font-weight: 500;width: 180px;display: flex;color: #262323;}
.sLocation .locaBox .address{border: 3px solid #aecce8;width: 100%;text-align: center;font-size: 1.13rem;border-radius: 1.5em;padding: 2em 1em 4em;position: relative;margin-top: 2em;}
.sLocation .locaBox .address p{color: #262323;font-weight: 300;line-height: 1.8;}
.sLocation .locaBox .address span{background: #aecce8;color: #fff;display: block;padding: 1.5em;border-radius: 0.8em 0.8em 1.5em 1.5em;position: absolute;width: 84%;bottom: -37px;}


/* === PEOPLE-PI === */
.piProfile{display: flex;justify-content: space-between;gap: 5em;}
.piLeft{flex: 1;}
.piLeft .prof{font-size: 1.25rem;font-weight: 600;color: var(--main-color);border-bottom: 1px solid #ddd;width: 100%;display: block;padding-bottom: 0.5em;}
.piLeft .title{display: flex;justify-content: space-between;margin: 1em 0;}
.piLeft .title h2{font-size: 3em;font-weight: 500;}
.piLeft .title .links{display: flex;gap: 1em;align-items: flex-end;}
.piLeft .title .links .linkBtn{background: #fff6f6;padding: 1em;height: 80px;display: flex;align-items: flex-end;border-radius: 30px;justify-content: center;position: relative;}
.piLeft .title .links .linkBtn::after{content:'';background: url(./../img/content/arml_icon.png) no-repeat center;width: 26px;height: 21px;position: absolute;top: 1em;left: 1em;}
.piLeft .title .links .linkBtn:first-child::after{background: url(./../img/content/svgIcon01.svg) no-repeat center;}
.piLeft .title .links .linkBtn:last-child::after{background: url(./../img/content/svgIcon02.svg) no-repeat center;}
.piLeft .title .links .linkBtn:first-child{background: #eaf3fc;}
.piLeft .txtBox{margin-bottom: 2em;}
.piLeft .txtBox h3{font-size: 1.35rem;font-weight: 600;border-bottom: 1px solid #dddddd;margin-bottom: 1em;padding-bottom: 0.5em;}
.piLeft .txtBox p,
.piLeft .txtBox p span{font-size: 1.2rem !important;font-weight: 300 !important;margin-bottom: 0.5em;font-family: "Outfit", sans-serif !important;color: rgb(51, 51, 51) !important;}
.piLeft .contact{}
.piLeft .contact .contact-item{margin-bottom: 0.5em;display: flex;align-items: center;color: #675f5f;font-size: 1.125rem;font-weight: 300;}
.piLeft .contact .contact-item i{background: #eaf3fc;padding: 0.5em;border-radius: 10px;font-size: 1.25rem;margin-right: 1em;}
.piLeft .contact .contact-item span{font-size: 1.25rem;font-weight: 500;width: 100%;max-width: 100px;display: flex;color: #262323;}
.piRight{width:568px;}
.piRight .imgBox{width: 100%;max-height: 676px;overflow: hidden;border-radius: 50px;}
.piRight .imgBox img{width: 100%;height: 100%;object-fit: cover;object-position: center;}

/* === PEOPLE-Current Members === */
.cmWrap{position: relative;}
.tabMenu {display: flex;justify-content: center;background: #edf1fa;border-radius: 40px;padding: 0.5em;width: fit-content;margin: 0 auto 6em;overflow: hidden;}
.tabMenu button {border: none;background: none;padding: 1em;cursor: pointer;font-size: 1.25rem;font-weight: 700;color: #0c2b57;border-radius: 40px;transition: 0.3s;}
.tabMenu button.active {background: #0c2b57;color: #fff;}
.cmMember {display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 3em 2em;}
.cmCon {background: #fff;border: 1px solid #e4e4e4;border-radius: 30px;overflow: hidden;display: flex;flex-direction: column;padding: 0.5em;}
.cmCon .imgBox {position: relative;border-radius: 30px;overflow: hidden;max-height: 443px;}
.cmCon .imgBox::before {content: "";position: absolute;left: 0;right: 0;bottom: -5px;height: 85px;backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px);mask-image: linear-gradient(to top, black 70%, transparent 100%);-webkit-mask-image: linear-gradient(to top, black 50%, transparent 100%);pointer-events: none;z-index: 1;}
.cmCon .imgBox::after {content: "";position: absolute;left: 0;right: 0;bottom: -5px;height: 85px;background: linear-gradient(to top, rgb(0 0 0 / 44%) 0%, rgba(0, 20, 37, 0.0) 100%);pointer-events: none;z-index: 2;}
.cmCon .imgBox img {width: 100%;height: 100%;object-fit: cover;}
.cmCon .name {text-align: center;font-weight: 400;font-size: 1.5rem;margin: 10px 0;color: #ffffff;/* margin-top: -5em; */position: relative;z-index: 10;top: -2.5em;}
.cmCon .cmInfo {padding: 0 1em 1em;margin-top: -1em;}
.cmCon .cmInfo p{margin-bottom: 0.5em;display: flex;align-items: center;color: #675f5f;font-size: 1.125rem;font-weight: 300;}
.cmCon .cmInfo p i{background: var(--main-color);padding: 0.5em;border-radius: 10px;font-size: 1rem;margin-right: 0.5em;color: #ffffff;}
.cmCon .cmInfo p span{font-size: 1.125rem;font-weight: 500;width: 80px;display: flex;color: #262323;}
.cmResearch {padding: 1em;}
.cmResearch h4 {font-size: 1.2rem;font-weight: 600;border-bottom: 1px solid #e0e0e0;color: #000;padding-bottom: 0.5em;margin-bottom: 1em;}
.cmResearch p {font-size: 1.125rem;margin: 0.5em 0;color: #675f5f;font-weight: 300;}
.cmResearch p span{font-family: Outfit, sans-serif !important;color: rgb(103, 95, 95) !important;font-size: 1.1rem !important;}
.cmResearch p br{display:none;}

.alumni {grid-template-columns: 1fr 1fr;gap: 2em;position: relative;}
.alumni .cmCon{flex-direction: row;align-items: center;border-radius: 15px;}
.alumni .imgBox{width: 150px;border-radius: 15px;}
.alumni .imgBox::before,
.alumni .imgBox::after{display:none;}
.alumni .name{top: 0;color: #000;text-align: left;font-weight: 600;border-bottom: 1px solid #d7d7d7;padding-bottom: 5px;margin-bottom: 12px;} 
.alumni .cmInfo{padding: 0 1em;margin-top: 0;flex: 1;}

/* === RESEARCH-list === */
.sResearch{}
.sResearch .search{}
.sResearch .search .title{font-size: 18px;color: var(--black-color);padding-bottom: 15px;}
.sResearch .search .title i{margin-left: 10px;transform: rotate(90deg);font-size: 22px;vertical-align: -1.5px;}
.sResearch .search .form-group{display: flex;flex-direction: row;justify-content: center;align-items: center;padding: 1.5em;background: #edf1fa;border-radius: 100px;}
.sResearch .search .form-group .row{width: 100%;margin-right: 1em;}
.sResearch .search .form-group .row:last-child {width: 50%;margin-right: 0;}
.sResearch .search .form-group .row .form-control{display: block;width: 100%;height: calc(3em + 0.75rem + 2px);padding: 0.375rem 1.75rem;font-size: 1rem;font-weight: 400;line-height: 1.5;color: #6e707e;background-color: #fff;background-clip: padding-box;border: 1px solid #e7e7e7;border-radius: 4em;transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;appearance: none; -webkit-appearance: none;  -moz-appearance: none; cursor: pointer;}
.sResearch .search .form-group .row .form-control:focus {color: #6e707e;background-color: #fff;border-color: #bac8f3;outline: 0;box-shadow: 0 0 0 0.2rem rgb(78 115 223 / 25%);}
.sResearch .search .form-group .row .btn{width: 100%;height: calc(3em + 0.75rem + 2px);border-radius: 5em;background: #154874;color: #fff;padding: 0.375rem 0.75rem;font-size: 1rem;font-weight: 400;line-height: 1.5;}
.sResearch .search .form-group .row .btn i{margin-right: 10px;}
.sResearch .search .form-group .row .btn:hover,
.sResearch .search .form-group .row .btn:focus{background: var(--main-color);transition: all 0.5s ease;}

.sResearchCon{display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 3em 2em;margin-top: 3em;}
.sResearchCon .txtBox h3 {border-bottom: 1px solid #e3e3e3;min-height: 50px;padding-bottom: 1em;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;position: relative;}
.sResearchCon .txtBox h3:after{content:'';position: absolute;background: #ffffff;width: 100%;height: 20px;bottom: 0;left: 0;}
.sResearchCon .infoBox .category{}
.sResearchCon .infoBox .category p{font-size: 0.95rem;margin-bottom: 0.5em;color: #000;min-height: inherit;}
.sResearchCon .infoBox .category p span{background: #154874;padding: 5px 10px;color: #fff;width: 55px;display: inline-block;text-align: center;border-radius: 50px;margin-right: 1em;}
.sResearchCon .rCard:nth-child(2n) {top: 0;}
.sResearchCon .rCard:hover {transform: translateY(0);}
.sResearchCon .infoBox .progress{font-size:1rem;}
.sResearchCon .infoBox { align-items: flex-start;}
.sResearchCon .infoBox .label{background: #154874;padding: 5px 10px;color: #fff;width: 55px;display: inline-block;text-align: center;border-radius: 50px;margin-right: 1em;}
.sResearchCon .infoBox .date{color: #939393;margin-top: 6px;}

/* === RESEARCH-view === */
.sResearchView{}
.sResearchView .sRes-imgBox{display: flex;justify-content: space-between;flex-direction: row;}
.sResearchView .sRes-imgBox .imgBox{width: 60%;display: flex;justify-content: space-between;flex-direction: column;align-items: center;position: relative;}
.sResearchView .sRes-imgBox .imgBox .img{position: relative;/* flex: 1; */width: 100%;height: 410px;border-radius: 2em;overflow: hidden;}
.sResearchView .sRes-imgBox .imgBox .img img{width: 100%;height: 100%;object-fit: cover;object-position: center;transition: opacity 0.3s ease-in-out; position: absolute;top: 0;cursor: pointer;}
.sResearchView .sRes-imgBox .imgBox .img img.fade-out {opacity: 0;}
.sResearchView .sRes-imgBox .imgBox .list{width: 100%;display: flex;flex-direction: row;gap: 0.5em;/* margin-left: 0.5em; */justify-content: center;margin-top: 0.5em;}
.sResearchView .sRes-imgBox .imgBox .list li{width: 100%;}
.sResearchView .sRes-imgBox .imgBox .list li a{/* height: 80px; */border-radius: 1em;overflow: hidden;display: block;height: 90px;}
.sResearchView .sRes-imgBox .imgBox .list li a img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.sResearchView .sRes-imgBox .txtBox{width: calc(50% - 3%);margin-left: 3%;color: #121212;position: relative;display: flex;flex-direction: column;justify-content: center;}
.sResearchView .sRes-imgBox .txtBox h2{font-size: 22px;margin-left: 110px;position: relative;}
.sResearchView .sRes-imgBox .txtBox h2:after{content: '';position: absolute;width: 100px;height: 30px;background: url(./../img/common/arml_logo.png) no-repeat !important;-webkit-print-color-adjust:exact;left: -110px;top: 6px;background-size: 100% !important;}
.sResearchView .sRes-imgBox .txtBox ul{background-color: #edf1fa !important;-webkit-print-color-adjust:exact;margin-top: 20px;padding: 1em 2em;border-radius: 3em;}
.sResearchView .sRes-imgBox .txtBox ul li{font-size:16px;position: relative;margin: 0.5em 0;padding: 0.5em;background: #fff;border-radius: 30px;display: flex;align-items: center;}
.sResearchView .sRes-imgBox .txtBox ul li h3{display: inline-block;line-height: 2;width: 100%;max-width: 120px;background: var(--main-color);color: #fff;text-align: center;border-radius: 50px;margin-right: 2em;font-weight: 500;}
.sResearchView .sRes-imgBox .txtBox ul li h3:after{content: '';position: absolute;width: 3px;height: 3px;left: 0;top: 20px;}
.sResearchView .sRes-imgBox .txtBox ul li a{}
.sResearchView .sRes-imgBox .txtBox ul li a i{font-size: 24px;vertical-align: sub;margin-right: 5px;}
.sResearchView .sRes-detail{margin: 3em 0 4em;border-bottom: 1px solid #e3e3e3;padding-bottom: 4em;}
.sResearchView .sRes-detail h4{font-size: 22px;color: #121212 !important; -webkit-print-color-adjust:exact;border-bottom: 2px solid #303030;position: relative;padding-bottom: 1em;}
.sResearchView .sRes-detail h4:after{content: '';position: absolute;width: 108px;height: 2px;background: var(--main-color);left: 0;bottom: -2px;}
.sResearchView .sRes-detail .con{padding: 2.5em 0 2em;font-size: 1.125rem;line-height: 1.8;}
.conIframe{display: flex;flex-wrap: wrap;gap: 0.5em;}
.conIframe iframe{max-width: 630px;max-height: 430px;display: flex;margin: 1em auto;}
.sResearchView .sRes-detail .infoBox{display: grid;grid-template-columns: 1fr 1fr;gap: 0.5em;margin: 1em 0 3em;}
.sResearchView .sRes-detail .infoBox p{font-size: 1rem;font-weight: 300;}
.sResearchView .sRes-detail .infoBox p span{width: 150px;display: inline-block;font-weight: 500;color: #000;background: #e9e9e9;text-align: center;padding: 0.3em 0.5em;border-radius: 10px;margin-right: 1em;}
.sResearchView .sRes-detail .infoBox p a:hover{opacity:0.5;}
.sResearchView .sRes-detail .infoBox p a i{margin-left: 10px;}
.sResearchView .sRes-detail .infoBox2{margin: 3em 0 0;display: flex;display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 2.5em;}
.sResearchView .sRes-detail .infoBox2 p{font-size: 1.125rem;font-weight: 300;display: flex;flex-direction: column;gap: 1em;}
.sResearchView .sRes-detail .infoBox2 p span{font-weight: 500;border-bottom: 1px dashed #000;padding-bottom: 0.5em;}.sResearchView .sRes-detail .infoBox2 p a{margin-left: 1.2em;position: relative;display: flex;align-items: center;color: #757575;}
.sResearchView .sRes-detail .infoBox2 p a:hover{color:#000;}
.sResearchView .sRes-detail .infoBox2 p a:after{content:'';position: absolute;width: 5px;height: 5px;background: var(--main-color);border-radius: 50%;left: -1.2em;}
.sResearchView .sRes-detail .infoBox2 p a i{margin-left: 0.5em;}

/* === popup Modal === */
.imgViewModal{position:fixed; inset:0;background:rgba(0,0,0,0.75);display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0; pointer-events:none; transition:.3s;}.imgViewModal.active{opacity:1; pointer-events:all;}
.imgViewModal-bg{position:absolute; inset:0;}
.imgViewModal-content{position:relative;max-width:90%; max-height:90%;z-index:10;display:flex; justify-content:center; align-items:center;}
.imgViewModal-content img{max-width:90vw;max-height:90vh;border-radius:12px;background:black;transition:opacity .3s;}
.imgViewModal .nav-btn{position: fixed;top: 50%;transform: translateY(-50%);font-size: 23px;line-height: 35px;background: #00000059;border-radius: 50%;width: 35px;height: 35px;text-align: center;padding: 20px;color: #ffffff;cursor: pointer;user-select: none;z-index: 20;opacity: .8;transition: .2s;}
.imgViewModal .nav-prev{Left:20px;}
.imgViewModal .nav-next{Right:20px;}
.imgViewModal .nav-btn:Hover{Opacity:1;}
.img-hover-caption {position: absolute;bottom: 12px;left: 50%;transform: translateX(-50%);background: rgba(0,0,0,0.55);color: #fff;padding: 6px 14px;border-radius: 20px;font-size: 13px;opacity: 0;transition: .25s ease;pointer-events: none;}
.img:hover .img-hover-caption {opacity: 1;}

/* === pagination === */
.pagination{display: flex;flex-direction: row;justify-content: center;align-items: center;margin: 5em 0 0;}
.pagination a{margin: 0 18px;font-size: 16px;}
.pagination a:hover{color: var(--black-color);transition: all 0.5s ease;}
.pagination .current{width: 41px;height: 41px;background: var(--main-color);border-radius: 50%;color: var(--white-color);text-align: center;line-height: 41px;}
.pagination .paging-arrow{width: 38px;height: 38px;border: 1px solid #dfdfdf;text-align: center;line-height: 1.9;font-size: 22px;border-radius: 50%;color: #838383;}
.pagination .paging-arrow:hover{border: 1px solid #9d9d9d;}

/* === btn === */
.btn-Box{display: flex;justify-content: flex-end;flex-direction: row;}
.btn-Box a{font-size:15px;color: var(--black-color);border:1px solid #d4d4d4;width: 150px;text-align: center;margin-left: 5px;padding: 10px;border-radius: 50px;}
.btn-Box a:hover{opacity: 0.8;}
.btn-Box a i{margin-right: 8px;font-size: 18px;vertical-align: text-bottom;}
.btn-Box .list{background:#474747 !important; -webkit-print-color-adjust:exact;color:var(--white-color);border:0;}

/* === prev next === */
.prev-next-box{border-top: 1px solid #e3e3e3;margin: 4em 0 0;}
.prev-next-box ul li{border-bottom: 1px solid #e3e3e3;padding: 1.5em;display: flex;justify-content: flex-start;align-items: center;}
.prev-next-box ul li span,
.prev-next-box ul li span a{color: #707070;font-size: 17px;font-weight: 300;}
.prev-next-box ul li span a:hover{color: var(--black-color);}
.prev-next-box .page{font-weight: 400;color: var(--black-color);width: 155px;display: flex;align-items: center;}
.prev-next-box .page i{margin: 0 20px 0 40px;border-right: 1px solid #c5c5c5;padding-right: 20px;vertical-align: text-bottom;}

/* === PUBLICATION === */
.sPublication{}
.sPublication ul{display: grid;}
.sPublication ul li{border-bottom: 1px dotted #cdcdcd;padding: 2em 0;text-align: justify;position: relative;display: flex;align-items: center;gap: 0 2em;justify-content: space-between;}
.sPublication ul li:hover a{display: block;}
.sPublication ul li strong{display: block;margin-top: 0.5em;color: #000;text-indent:0;}
.sPublication .linkBox{display: flex;align-items: center;gap: 0.5em;width: 150px;justify-content: flex-end;}
.sPublication .linkBox i{background: #eaf3fc;padding: 0.5em;border-radius: 10px;font-size: 1.5rem;color: #2192ce;}
.sPublication .video{display: flex;gap: 0.5em;}
.sPublication .video a:hover i{color: #ff0033;transition: all 0.5s ease;}
.sPublication .link{}
.sPublication .link a{}

/* === board === */
.searchBox{background: #edf1fa;padding: 2em 2em 3em;border-radius: 100px;}
.searchBox .board_search{display: flex;flex-direction: row;justify-content: center;align-items: center;}
.searchBox .board_search .row{margin: 0 10px;position: relative;}
.searchBox .board_search .row .select,
.searchBox .board_search .row .input{border: 0;background: #edf1fa;font-size: 18px;width: 150px;border-bottom: 2px solid #222;padding: 10px;}
.searchBox .board_search .row .input{width: 300px;font-weight: 300;}
.searchBox .board_search .row .input:focus {outline: none;}
.searchBox .board_search .row .bs-btn{font-size: 26px;background: #edf1fa;vertical-align: middle;padding: 0 10px;position: absolute;right: 0;top: 6px;}

.labelBox em{text-align: center;font-weight: 500;color: #fff;display: inline-block;position: relative;min-width: 50px;background: #363636;font-size: 15px;border-radius: 15px;margin-right: 20px;padding: 5px 10px;}
.labelBox em.news{background: #007aff;}
.labelBox em.label1{background: #42995c;}
.labelBox em.label2{background: #399ab7;}
.labelBox em.label3{background: #8f3eb1;}
.labelBox em.label4{background: #235995;}
.labelBox em.label5{background: #6c7b8d;}
.labelBox em.ing{background: var(--main-color);}
.labelBox span.ing{background: #e54747 !important;}

.boardView{background: #fff;border-top: 2px solid #141414;}
.boardView .viewTop{padding: 1.5rem;border-bottom: 1px solid #e3e6f0;}
.boardView .viewTop h2{font-size: 22px;display: inline-block;}
.boardView .viewTop h2 em{vertical-align: 3px;}
.boardView .viewTop span{font-size: 15px;color: #9f9f9f;margin-top: 10px;display: block;}
.boardView .data{border-top: 1px solid #e3e6f0;padding: 1rem 1.5rem;font-size: 17px;}
.boardView .data span{margin-right: 15px;color: #000;font-weight: 600;border-right: 1px solid #e3e6f0;}
.boardView .file{border-bottom: 1px solid #e3e6f0;padding: 1rem 1.5rem;font-size: 17px;}
.boardView .file span{margin-right: 15px;color: #000;font-weight: 600;border-right: 1px solid #e3e6f0;padding-right: 27px;}
.boardView .file a i{margin-right: 6px;color: #4a4a4a;}
.boardView .con{padding: 2rem 1.5rem;font-size: 17px;line-height: 2rem;border-bottom: 1px solid #e3e6f0;margin-bottom:3em;}
.boardView .con img{width: auto;max-width: 100%;margin: 1em 1em 0 0;}
.boardView .con img:last-of-type{margin-bottom:1em;}

.strong{font-size: 1.5rem;width: 500px;text-align: center;margin: 0 auto 2em;color: #f70000;}

/* === Gallery === */
.sGallery{column-count:4;column-gap:14px;}
.sGallery .item{break-inside:avoid;margin-bottom:14px;overflow:hidden;border-radius:12px;cursor:pointer;opacity:0;transform:translateY(20px);}
.sGallery .item img{width:100%;height:auto;display:block;border-radius:12px;transition:transform .3s ease;}
.sGallery .item:hover img{transform:scale(1.05);}
@media (max-width:1000px){.sGallery{column-count:3}}
@media (max-width:700px){.sGallery{column-count:2}}
@media (max-width:480px){.sGallery{column-count:1}}

/* Modal */
.overlay{position:fixed;inset:0;background:var(--overlay);display:none;align-items:center;justify-content:center;z-index:1000;padding:20px;}
.overlay.show{display:flex;}
.overlay .modal{background:#fff;border-radius:12px;max-width:1000px;max-height:90vh;overflow:hidden;display:flex;flex-direction:row;box-shadow:0 10px 40px rgba(0,0,0,0.3);opacity:0;transform:scale(0.95);}
.overlay .modal img{max-width:100%;height:auto;object-fit:contain;background:#000;}
.overlay .modal-left,.modal-right{display:flex;align-items:center;justify-content:center;}
.overlay .modal-left{flex:1; background:#000;}
.overlay .modal-right{width:340px;padding:22px;background:#fff;color:#333;font-size:15px;line-height:1.6;overflow:auto;}
.overlay .close-btn,
.overlay .nav-btn,
.overlay .count{position:absolute;color:#fff;z-index:1100;}
.overlay .close-btn{top:20px;right:20px;background:none;border:0;font-size:32px;cursor:pointer;}
.overlay .nav-btn{top:50%;transform:translateY(-50%);background:none;border:0;font-size:44px;cursor:pointer;padding:10px 16px;}
.overlay .nav-btn.left{left:20px;}
.overlay .nav-btn.right{right:20px;}
.count{top:20px;left:30px;font-size:15px;font-weight:500;background:rgba(0,0,0,0.4);padding:6px 10px;border-radius:8px;}

/* === login === */
.loginWrap{width: 420px;margin: 0 auto;padding: 10em 0;}
.loginWrap .ol{border: 1px solid #d7d7d7;border-radius: 0;border: 0;border-top: 1px solid #5b5b5b;border-radius: 0;border-bottom: 1px solid #5b5b5b;}
.loginWrap .ol form{padding: 50px 30px;}
.loginWrap .ol h2,
.loginWrap .ol .join,
.loginWrap #ol_be_cate,
.loginWrap #ol_after_private,
.loginWrap #ol_after_info,
.loginWrap #ol_svc{display:none;}
.loginWrap #ol_before .ol_wr{width:100%;}
.loginWrap #ol_before .ol_wr input[type=text],
.loginWrap #ol_before .ol_wr input[type=password]{background: #fff !important;background-color: #fff !important;width: 100%;border: 1px solid #e1e1e1;border-radius: 0;padding: 5px 10px;width: calc(100% - 22px);}
.loginWrap #ol_id{}
.loginWrap #ol_submit{height: 55px;border-radius: 0;background: #141414;padding: 10px;}
.loginWrap .logTitle{font-size: 20px;margin: 16px 0 !important;text-align: left;}
.loginWrap .logbtn{margin-bottom: -10px;}
.loginWrap .logbtn a{width: 95%;display: block;background: #28374c;color: #fff;padding: 10px !important;border-radius: 50px;transition:all 0.5s;font-size: 18px;}
.loginWrap .logbtn a:hover{background: #395e93;}
.loginWrap .logbtn a i{margin-right:10px;}
.loginWrap #ol_after_hd {display: flex;align-items: center;}
.loginWrap #ol_after_hd strong {margin: 0 0 10px;font-size: 1.25rem;}
.loginWrap .chk_box input[type="checkbox"] + label {padding-left: 30px;}
.loginWrap h1{font-size: 2rem;text-align: center;margin: 3em 0 0;padding-bottom: 0.5em;}
.admBtn a{position: absolute;font-size: 18px;margin-top: -1em;}

.skinAdmBtn{display: flex;justify-content: flex-end;margin: 2em 0;}
.skinAdmBtn a{background: #01162c;padding: 0.5em;display: block;width: 120px;text-align: center;border-radius: 50px;color: #fff;}
.skinAdmBtn a:hover{background: #2192ce;}

.cmMember .skinAdmBtn{position: absolute;bottom: -5em;right: 0;margin: 0;}
.no_image{text-align: center;display: block;color: #898989;text-transform: capitalize;font-size: 1.5rem;font-weight: 300;background: url(./../img/content/no_img.png) no-repeat center;text-indent: -9999px;}

#bo_v_info{margin-top: -4em;}
#bo_v_atc {padding: 2em 0}
.cke_sc{display:none;}
.full_input{width:calc(100% - 10px);box-shadow: none;}
.label-font {font-size: 1.5rem;}

#bo_w .bo_w_flie .frm_file{display: inline-block;height: 40px;line-height: 40px;padding: 0 0 0 13px;vertical-align: middle;width: 78%;color: #999999;}
#bo_w .bo_w_flie .lb_icon{display: inline-block;color: #fff;vertical-align: middle;background-color: #999999;cursor: pointer;margin-left: 3px;width: 78px;font-size: 0.9em;margin-top: 7px;padding-right: 10px;border-radius: 3px;}
#bo_w .bo_w_flie .frm_file input[type="file"]{position: absolute;width: 0;height: 0;padding: 0;overflow: hidden;border: 0;}
#bo_w .bo_w_flie .file_del {top: 16px;}
#bo_w .btn_submit {font-size: 1em;background: var(--main-color);font-weight: 400;}
#bo_w .btn_cancel {font-size: 1em;color: #fff;font-weight: 400;vertical-align: -1px;}
.bo_cate_link {line-height: 20px;}
.bo_tit {margin-top: 4px;}
#bo_w .bo_w_tit .frm_input{padding-right:0;}

.textGuide{background: #e8f2ff;padding: 1em;border-radius: 30px;text-align: center;margin-top: -3em;margin-bottom: 2em;}
.textGuide span{}

#ol_after_hd .profile_img{position: relative;}
#ol_after_hd .profile_img::after{content: '';background: url(./../img/content/arml_icon.png) no-repeat center #eaf3fc;width: 52px;height: 52px;position: absolute;top: 0;right: 0;background-size: auto;border-radius: 50%;}
#ol_after_hd .profile_img img{border:1px solid #eaf3fc !important;}

/*
===============================================
animation
===============================================
*/
  @keyframes floatAround {
    0%   { transform: translate(-50%, -50%) translate(0px, 0px) scale(1); }
    25%  { transform: translate(-50%, -50%) translate(80px, -100px) scale(1.1); }
    50%  { transform: translate(-50%, -50%) translate(-120px, 80px) scale(1.05); }
    75%  { transform: translate(-50%, -50%) translate(100px, 120px) scale(0.95); }
    100% { transform: translate(-50%, -50%) translate(-80px, -60px) scale(1); }
  }

/*
===============================================
¹ÝÀÀÇü css
===============================================
*/

@media all and (max-width:1600px){
	.sHistory {gap: 3em;}
	.sHistory .timeline .timeBox .month dl dd {font-size: 1.25rem;}
	.sHistory .timeline .timeBox .year {width: 95px;font-size: 1.5em;padding-left: 25px;}

	.sLocation .mapBox iframe {width: 600px;}
}

@media all and (max-width:1380px){
	.sMissionWrap .misTitle {font-size: 4rem;}
	.sMissionWrap .sMissionBox .imgBox {margin-right: 0;}
	.sMissionWrap .sMissionBox .txtBox .con {margin-top: 3em;text-align: center;}
	.sMissionWrap .sMissionBox {padding: 6em 0;flex-direction: column;position: relative;}
	.sMissionWrap .sMissionBox .txtBox .waterMark {margin: 0;position: absolute;top: 75%;left: 50%;z-index: -1;margin-left: -258px;}

	.piRight {width: 450px;}
	.piProfile {gap: 3em;}
	.piLeft .txtBox p {font-size: 1.1rem !important;}
}

@media all and (max-width:1280px){
	.sMissionTab .misTabTitle {font-size: 4rem;}
	.sMissionTab .misTabTitle span {font-size: 1.5rem;width: 210px;}
	.misTabWrap .misImgBox {flex: none;width: 40%;}
	.misTabWrap {margin-bottom: 1em;gap: 1em;}
	.misTabWrap .tabItem button {padding: 0.8em 1.2em;}
	.misTabWrap .tabItem.active .con {padding: 1em 2.5em;font-size: 1.125rem;}

	.sHistory .timeline .timeBox {align-items: flex-start; flex-direction: column;}

	.sLocation {gap: 4em;flex-direction: column;}
	.sLocation .mapBox {width: 100%;}
	.sLocation .mapBox iframe {width: 100%;height: 400px;}

	.piProfile {flex-direction: column;align-items: center;margin-bottom: 4em;}
	.piLeft {width: 100%;}
	.piRight {width: 568px;}

	.cmMember {grid-template-columns: 1fr 1fr;gap: 1em;}

	.sResearchCon {grid-template-columns: 1fr 1fr;gap: 1em;}
	.sResearch .search .form-group {flex-wrap: wrap;border-radius: 20px;}
	.sResearch .search .form-group .row {width: 48%;margin: 0.25em}
	.sResearch .search .form-group .row:last-child {margin-top: 1em;}
}

@media all and (max-width:1024px){
	.sHistory .timeline .timeBox .month dl dt {width: 75px;font-size: 1.125rem;}
	.sHistory .imgWrap {width: 340px;}
	.sHistory {gap: 2em;}

	.sResearchView .sRes-imgBox {flex-direction: column;}
	.sResearchView .sRes-imgBox .imgBox {width: 100%;}
	.sResearchView .sRes-imgBox .txtBox {width: 100%;margin-left: 0;margin-top: 2em;}
}

@media all and (max-width:940px){
    .sMissionWrap .misTitle {font-size: 3.5rem;}
	.sMissionWrap .sMissionBox .txtBox .con {font-size: 1.25rem;}

	.sHistory {align-items: center;flex-direction: column;}
	.sHistory .timeline {width: 100%;}
	.sHistory .timeline .timeBox {padding-bottom: 1em;margin-top: 2em;}
	.sHistory .imgWrap {width: 100%;display: flex;flex-wrap: wrap;gap: 2%;}
	.sHistory .imgWrap .imgBox {width: 49%;margin-bottom: 2%;}
	.sHistory .imgWrap .imgBox span {font-size: 1.125rem;}
	.sHistory .timeline .timeBox .month dl {gap: 1em;}
	.sHistory .timeline .timeBox .month dl dd {font-size: 1.125rem;}

}

@media all and  (max-width:820px){
	.modal{flex-direction:column !important;}
	.modal-right{width:calc(100% - 44px) !important;max-height: 100%;overflow: initial;}
	.overlay .modal{overflow-y:auto;}
	.modal-left img {width:100%;max-height:none;}
}

@media all and (max-width:768px){
	.sMissionWrap .misTitle {font-size: 2.5rem;}
	.sMissionWrap .sMissionBox .txtBox .con {font-size: 1.125rem;}

	.misTabWrap {flex-direction: column;height: auto;}
    .misTabWrap .misImgBox {flex: none;height: 300px;width: 100%;}
	.misTabWrap .tabItem {height: auto;padding: 2em 0;}
	.misTabWrap .tabItem button {font-size: 2rem;}
	.sMissionTab .misTabTitle {font-size: 2.5rem;}
	.sMissionTab .misTabTitle span {font-size: 1rem;width: 150px;margin-bottom: 1em;}

	.piLeft .title h2 {font-size: 2.5em;}

	.tabMenu {margin: 0 auto 3em;}
	.alumni .cmCon{flex-direction: column;}

	.sResearchCon {grid-template-columns: 1fr;}
	.sResearchView .sRes-detail .infoBox2 {grid-template-columns: 1fr 1fr;}
}

@media all and (max-width:640px){
	.sMissionWrap .misTitle {font-size: 2rem;}
	.sMissionWrap .sMissionBox .txtBox .con{text-align: left;}
	.sMissionWrap .sMissionBox {padding: 3em 0;}
	.sMissionWrap .sMissionBox .imgBox {width: 100%;}
	.sMissionWrap .sMissionBox .imgBox img {width: 100%;}
	.misTabWrap .tabItem button {font-size: 1.8rem;padding: 0.8em 1.5em;}

	.sHistory .imgWrap .imgBox {width: 100%;}

	.sLocation .locaBox {width: 100%;max-width: calc(100% - 6%);}
	.sLocation .locaBox .address span {width: calc(100% - 3em);left: 0;}

	.sLocation .locaBox .contact .contact-item i {font-size: 1.125rem;}
	.sLocation .locaBox .contact .contact-item span {font-size: 1.125rem; width: 140px;}
	.sLocation .locaBox .contact .contact-item {font-size: 1.1rem;}
	.sLocation .mapBox iframe {height: 300px;}

	.piLeft .title {flex-direction: column;}
	.piLeft .title .links {margin-top: 1em;}
	.piLeft .title .links .linkBtn {height: 22px;width: 100%;}
	.piRight {width: 100%;}
	.piProfile {margin-bottom: 1em;}

	.cmMember {grid-template-columns: 1fr;}
	.tabMenu button {font-size: 1.125rem;}
	.alumni .cmInfo {width: 85%;}

	.sResearchView .sRes-detail .infoBox,
	.sResearchView .sRes-detail .infoBox2{grid-template-columns: 1fr;}
	.sResearchView .sRes-imgBox .imgBox .img {height: 230px;}
	.sResearchView .sRes-imgBox .imgBox .list li a{height: 50px;}
	.sResearchView .sRes-imgBox .txtBox ul {padding: 1em;border-radius: 1em;}
	.sResearch .search .form-group {padding: 1.5em 0.5em;}
	.sResearch .search .form-group .row {width: 47%;}
	.searchBox .board_search .row .select, 
	.searchBox .board_search .row .input {width: 100%;font-size: 1rem;}
	.searchBox .board_search .row .bs-btn {right: -25px;}
	.searchBox {padding: 1em 1em 2em;border-radius: 20px;}
	.searchBox .board_search .row {margin: 0 10px 0 0;}
	.boardView .viewTop h2 em {display: block;width: 80px;margin-bottom: 0.5em;}
	.sResearch .search .form-group .row:last-child {width: 100%;}
	.conIframe iframe {max-width: 100%;max-height: 300px;}

	.sPublication ul li {align-items: flex-start;flex-direction: column;padding: 1em 0;font-size: 0.9rem;}
	.sPublication .linkBox{margin-top:0.5em;justify-content: flex-start;}
}

@media all and (max-width:480px){
	.sLocation .locaBox .address { font-size: 1rem;}
	.alumni .cmInfo {width: 90%;}
	.sResearchView .sRes-detail .infoBox p span {width: 90px;font-size: 0.9rem;margin-right: 0.5em;}
	.prev-next-box {margin: 4em 0 0;}
	.prev-next-box ul li span, 
	.prev-next-box ul li span a { font-size: 0.9rem;}
	.sResearchView .sRes-imgBox .imgBox .list {gap: 0.2em;}
}