@charset "utf-8";

@import url(basic.css);


/*
 'Noto Sans KR - 3,4,5,7,9'
 'NanumSquare - 3,4,7,8'
Roboto - 1,3,4,5,7
*/

/* Topics Page Styles */
.topics-intro {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 20px 25px;
    margin-bottom: 30px;
    border-radius: 8px;
    border-left: 4px solid #07357d;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.topics-intro p {
    margin: 0;
    color: #555;
    font-size: 15px;
    line-height: 1.6;
    font-weight: 400;
}

.topics-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.topic-item {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    padding: 6px 15px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e8e9ea;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.topic-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(7,53,125,0.08);
    border-color: #07357d;
}

.topic-item:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(135deg, #07357d 0%, #0a4a9c 100%);
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

.topic-item:hover:before {
    transform: scaleY(1);
}

.topic-number {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, #07357d 0%, #0a4a9c 100%);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
    margin-right: 15px;
    box-shadow: 0 2px 8px rgba(7,53,125,0.2);
    transition: all 0.3s ease;
}

.topic-item:hover .topic-number {
    transform: scale(1.05);
    box-shadow: 0 3px 12px rgba(7,53,125,0.3);
}

.topic-content {
    flex: 1;
    display: flex;
    align-items: center;
}

.topic-content h4 {
    margin: 0;
    color: #07357d;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.2;
    transition: color 0.3s ease;
}

.topic-item:hover .topic-content h4 {
    color: #0a4a9c;
}

.topic-content p {
    margin: 0;
    color: #666;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
}

/* Responsive design for topics */
@media (max-width: 768px) {
    .topic-item {
        flex-direction: column;
        text-align: center;
        padding: 15px;
    }
    
    .topic-number {
        margin: 0 auto 15px auto;
    }
    
    .topics-intro {
        padding: 15px 20px;
        margin-bottom: 20px;
    }
}

/*wrap*/
#wrap {width:100%; min-width:1200px;}

/*header*/
#header {width:100%; min-width:1200px; height:100px; background:#07357d; position:absolute; top:0; left:0; z-index:9999; box-shadow:0 2px 4px rgba(0,0,0,0.1);}
#header .head {width:1500px; margin:0 auto; position:relative; z-index:9999; overflow:visible;}
#header .head .logo {width:160px; height:100px; position:absolute; top:0; left:0; background:#07357d; display:flex; align-items:center; padding-left:5px; z-index:10000;}
#header .head .logo img {max-height:60px; width:auto; background-color:#07357d !important; mix-blend-mode:screen;}
#header .head .gnb {margin-left:200px; display:flex; flex-wrap:nowrap; height:100px; align-items:center; position:relative; }
#header .head .gnb > li {float:left; position:relative; margin:0px; flex-shrink:0; padding-top: 25px;}
#header .head .gnb > li > a {display:block; height:50px; line-height:50px; padding:0 10px; color:#ffffff !important; text-decoration:none; font-size:20px; font-weight:500; transition:all 0.3s ease; white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,0.3);}
#header .head .gnb > li > a:hover, #header .head .gnb > li.on > a {background:rgba(255,255,255,0.1); color:#fff;}
#header .head .gnb > li.on > a.prNone {padding-right:12px !important;}
#header .head .gnb > li > ul {display:none; position:absolute; top:70px; z-index:9999; background:#fff; box-shadow:0 4px 12px rgba(0,0,0,0.15); min-width:200px; border-radius:6px; border:1px solid #e0e0e0; overflow:hidden;}

/* Dropdown menu styles - 参照华南理工大学官网设计 */
#header .head .gnb > li > ul > li {display:block; position:relative;}
#header .head .gnb > li > ul > li > a {display:block; padding:14px 24px; color:#333 !important; text-decoration:none; font-size:16px; font-weight:400; border-bottom:1px solid #f5f5f5; transition:all 0.3s ease; position:relative; white-space:nowrap;}
#header .head .gnb > li > ul > li > a:hover {background:linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); color:#07357d !important; transform:translateX(3px);}
#header .head .gnb > li > ul > li > a:before {content:''; position:absolute; left:8px; top:50%; width:4px; height:4px; background:#07357d; border-radius:50%; transform:translateY(-50%); opacity:0; transition:opacity 0.3s ease;}
#header .head .gnb > li > ul > li > a:hover:before {opacity:1;}
#header .head .gnb > li > ul > li:last-child > a {border-bottom:none;}

/* Show dropdown on hover with animation - 修复鼠标移动到子菜单时消失的问题 */
#header .head .gnb > li:hover > ul,
#header .head .gnb > li > ul:hover {display:block; animation:dropdownFadeIn 0.3s ease-out;}

/* 为dropdown菜单添加过渡区域，防止鼠标移动时hover状态丢失 */
#header .head .gnb > li.has-dropdown:hover:before {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 10px;
    background: transparent;
    z-index: 9998;
}

/* Dropdown animation */
@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Enhanced dropdown arrow indicator - only for items with dropdown menus */
#header .head .gnb > li.has-dropdown > a:after {content:''; display:inline-block; margin-left:5px; width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:4px solid rgba(255,255,255,0.7); transition:transform 0.3s ease;}
#header .head .gnb > li.has-dropdown:hover > a:after {transform:rotate(180deg);}

/* PROGRAM dropdown specific styles */
#header .head .gnb > li > ul.s5 {min-width:160px;}
#header .head .gnb > li > ul.s5 > li > a {padding:12px 20px; font-size:16px;}
#header .head .global {position:absolute; top:5px; right:0;}
#header .head .global > a {display:inline-block; padding:0 12px 0 10px; background:url('../images/common/globalLine.png') no-repeat left; color:#ffffff !important; font-size:13px; font-weight:500; text-shadow:0 1px 2px rgba(0,0,0,0.3);}
#header .head .global > a:hover {color:#fff; background:rgba(255,255,255,0.1);}
#header .head .global .user-info {color:#fff; margin-right:15px;}
#header .head .global .user-link {color:#fff; text-decoration:underline;}
#header .head .global .btn-logout {color:#fff; padding:5px 15px; border-radius:3px; text-decoration:none; background:#07357d;}
#header .head .global > a:first-child {background:none;}

/* Language Toggle Styles */
.language-toggle {display:none; margin-left:15px;}
.language-toggle a {display:inline-block; padding:0 8px; color:#fff; font-size:13px; font-weight:500; text-decoration:none;}
.language-toggle a:hover {color:#fff; background:rgba(255,255,255,0.2);}
.language-toggle a.active {color:#fff; font-weight:700; background:rgba(255,255,255,0.2); border-radius:3px;}
.lang-separator {color:#fff; margin:0 5px; font-size:13px;}

/* Language toggle on white cards (login/signup) */
.coming-box .language-toggle a {color:#07357d;}
.coming-box .language-toggle a:hover {background:rgba(7,53,125,0.08); color:#07357d;}
.coming-box .lang-separator {color:#07357d;}

/* Committee Photo Styles */
.commiList.with-photos {list-style:none; padding:0;}
.commiList.with-photos li {display:flex; align-items:flex-start; margin-bottom:15px; padding:15px; background:rgba(248,249,250,0.8); border-radius:8px; border-left:4px solid #07357d; box-shadow:0 2px 4px rgba(0,0,0,0.05);}
.commiList.with-photos li .photo {width:70px; height:70px; margin-right:20px; border-radius:50%; overflow:hidden; flex-shrink:0; box-shadow:0 3px 10px rgba(0,0,0,0.15);}
.commiList.with-photos li .photo img {width:100%; height:100%; object-fit:cover;}
.commiList.with-photos li .info {flex:1; padding-top:5px;}
.commiList.with-photos li .info .name {font-weight:600; color:#07357d; font-size:17px; margin-bottom:5px; line-height:1.3;}
.commiList.with-photos li .info .affiliation {color:#555; font-size:14px; line-height:1.5; margin-top:2px;}
.commiList.with-photos li:hover {background:rgba(248,249,250,1); transform:translateY(-1px); box-shadow:0 4px 8px rgba(0,0,0,0.1);}


/*visual*/
#visual {margin-top: 100px; width:100%; min-width:1200px; height:370px; overflow:visible; position:relative; background-attachment: scroll; background-position: center center; background-image:url('/images/main/hero.jpg'); background-repeat:no-repeat; background-size:100% 100%;}
#visual .copy {width:100%; min-width:1200px; position:absolute; left:0; top:180px; z-index:999; text-align:center;}
#visual .roll {position:relative; width:600%; height:100%;}
#visual .roll > li {overflow:hidden; float:left; width:16.666%; height:100%;}
#visual .roll .bg1 {background:url('../images/main/R-1.jpg') no-repeat center top; background-size:cover;}
#visual .roll .bg2 {background:url('../images/main/R-2.jpg') no-repeat center top; background-size:cover;}
#visual .roll .bg3 {background:url('../images/main/R-3.jpg') no-repeat center top; background-size:cover;}
#visual .roll .bg4 {background:url('../images/main/R-4.png') no-repeat center top; background-size:cover;}
#visual .roll .bg5 {background:url('../images/main/R-5.png') no-repeat center top; background-size:cover;}
#visual .roll .bg6 {background:url('../images/main/R-6.jpg') no-repeat center top; background-size:cover;}
#visual .controlBox {width:100%; position:absolute; bottom:150px; left:0; text-align:center; z-index:88;}
#visual .controlBox > p {display:inline-block;}
#visual .controlBox .tab {}
#visual .controlBox .tab > a {width:9px; height:9px; display:inline-block; margin:0 12px; border:3px solid #fff; border-radius:20px;
-webkit-border-radius:20px;
-moz-border-radius:20px;}
#visual .controlBox .tab a.active {background:#fff;}
#visual .controlBox .play {margin-left:15px;}
#visual .controlBox .play > a {width:18px; height:18px; display:inline-block; background:url('../images/main/visual_stop.png') no-repeat center 4px;}
#visual .controlBox .play a.go {background:url('../images/main/visual_play.png') no-repeat center 4px;}

/*main container*/
#mainContainer {width:100%; min-width:1200px;}
.mContainer {width:1200px; margin:0 auto; position:relative;}

.app-modal {position:fixed; top:0; left:0; right:0; bottom:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.4); z-index:10000;}
.app-modal.show {display:flex;}
.app-modal__content {width:480px; max-width:90%; background:#fff; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,0.2); animation:dropdownFadeIn 0.25s ease-out;}
.app-modal__header {background:#07357d; color:#fff; padding:12px 16px; border-radius:8px 8px 0 0;}
.app-modal__title {margin:0; font-size:16px; font-weight:600; color: #fff;}
.app-modal__body {padding:16px; color:#333;}
.app-modal__message {margin:0; line-height:1.6;}
.app-modal__footer {padding:12px 16px; text-align:right;}
.app-modal__btn {background:#07357d; color:#fff; border:0; padding:8px 14px; border-radius:6px; cursor:pointer;}
.app-modal__btn:hover {opacity:0.92;}



.mTitle {height:35px; line-height:35px; font-size:18px; color:#000; letter-spacing:4px; background:url('../images/main/titleDot.png') no-repeat right; padding-right:55px; text-transform:uppercase; display:inline-block; font-weight:500; margin-bottom:30px;}

/* date - three-column strip (new) */
#im_date {width:100vw; position:relative; left:50%; transform:translateX(-50%); padding:30px 0; background:linear-gradient(to bottom, #f1f5f9 0%, #e2e8f0 100%);} 
#im_date .date-strip {display:flex; align-items:stretch; justify-content:space-between; gap:24px; max-width:1200px; margin:0 auto; padding:0 20px; box-sizing:border-box;}
#im_date .date-title {flex:0 0 220px; display:flex; align-items:flex-start; justify-content:flex-start; padding-top:8px;}
#im_date .date-item {flex:1; background:rgba(255,255,255,0.92); border:1px solid #e6eef6; border-radius:12px; box-shadow:0 10px 24px rgba(7,53,125,0.08); padding:18px 16px; text-align:center;}
#im_date .date-item .label {display:block; color:#07357d; font-weight:600; font-size:18px; margin-bottom:8px;}
#im_date .date-item .value {display:block; color:#111; font-size:20px; font-weight:500;}

@media (max-width:1199px) { 
    #im_date .date-strip {max-width:100%; padding:0 16px;} 
}
@media (max-width:768px) {
    #im_date .date-strip {flex-direction:column;}
}

.right-sponsors {position:fixed; right:20px; bottom:20px; width:15vw; min-width: 200px; z-index:9999;}
.right-sponsors .rs-box {background:#ffffff; border-radius:14px; box-shadow:0 14px 34px rgba(7,53,125,0.16), 0 8px 16px rgba(0,0,0,0.06); border:1px solid #e7ecf6; overflow:hidden; height:40vh; min-height:300px; display:flex; flex-direction:column;}
.right-sponsors .rs-head {display:flex; align-items:center; justify-content:center; padding:12px 14px; background:linear-gradient(135deg,#0a3b8a,#0b2f6a);} 
.right-sponsors .rs-title {margin:0; font-weight:700; color:#fff; font-size:16px; letter-spacing:.6px; text-align:center;}
.right-sponsors .rs-body {padding:10px 10px 10px; flex:1; display:flex; flex-direction:column;}
.right-sponsors .logo-viewport {flex:1; height:auto; overflow:auto; position:relative;}
.right-sponsors .logo-list {display:flex; flex-direction:column; gap:10px; width:100%; margin:0; padding:0 14px; box-sizing:border-box;}
.right-sponsors .logo-item {display:block; padding:10px; border:1px solid #e8edf6; border-radius:10px; background:#fff; transition:.2s ease;}
.right-sponsors .logo-item:hover {box-shadow:0 6px 14px rgba(7,53,125,0.12); transform:translateY(-2px);} 
.right-sponsors .logo-item img {width:100%; height:auto; max-height:12vh; object-fit:contain; display:block;}
.right-sponsors .more {display:flex; align-items:center; justify-content:flex-end; gap:6px; padding:8px 14px 12px; font-size:12px; color:#0a3b8a; text-decoration:none;}
.right-sponsors .more:after {content:'›'; font-size:14px;}

/* keep sponsors visible on all widths for responsiveness */
@media (max-width: 1199px) {
    .right-sponsors {display:block;}
}
/* removed legacy list-styles for #im_date */

/*organized by*/
#organizedBy {margin-top: 30px;margin-bottom:80px; text-align:left;}
#organizedBy .organized-logo {margin-top:20px;}
#organizedBy .organized-logo img {max-width:500px; height:auto; opacity:0.9; transition:opacity 0.3s ease;}
#organizedBy .organized-logo img:hover {opacity:1;}

/*main btn*/
#mBtn {overflow:hidden; background:url('../images/main/btnLine.gif') no-repeat center 85px; margin-bottom:80px;}
#mBtn > ul > li {width:194px; height:230px; float:left;}
#mBtn > ul > li > a {width:100%; height:230px; padding-top:53px; font-size:17px; color:#444; line-height:120%; text-decoration:none; text-align:center; display:block; box-sizing:border-box;}
#mBtn > ul > li > a > img, #mBtn ul > li > a > span {display:inline-block; margin-bottom:45px;}
#mBtn > ul > li > a:hover {color:#fff; background-color:#041e47;}
#mBtn > ul > li > a:hover > span {animation-name:btn;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;}

#mBtn > ul > li > a > span {display:none;}
#mBtn > ul > li > a:hover > img {display:none;}
#mBtn > ul > li > a:hover > span {display:inline-block;}


@keyframes btn {
	16.65% {
	-webkit-transform: translateY(6px);transform: translateY(6px);
  }
  33.3% {
	-webkit-transform: translateY(-4px);
	transform: translateY(-4px);
  }
  49.95% {
	-webkit-transform: translateY(3px);
	transform: translateY(3px);
  }
  66.6% {
	-webkit-transform: translateY(-2px);
	transform: translateY(-2px);
  }
  83.25% {
	-webkit-transform: translateY(0px);
	transform: translateY(0px);
  }
  100% {
	-webkit-transform: translateY(0);
	transform: translateY(0);
  }
}


/*message*/
#messageBg {padding-top:0px;}
#message {width:100%; min-width:1200px; height:880px; background:url('../images/main/messageBg.jpg') no-repeat; box-sizing:border-box; padding:80px 0;}
#message .meWrap {width:1200px; margin:0 auto; background:url('../images/main/meTxtBg.png'); padding:55px 70px; box-sizing:border-box;}
#message .meWrap > div .mTitle {color:#07357d;}
#message .meWrap > ul {overflow:hidden; margin-bottom:30px;}
#message .meWrap > ul > li {width:350px; float:left; box-sizing:border-box;}
#message .meWrap > ul > li:first-child {margin-right:70px;}
#message .meWrap > ul > li > ol > li {padding:15px 10px; border-bottom:1px solid #ddd; color:#d10938;}

/*venue*/
#venue {overflow:hidden; margin-bottom:80px;}
#venue > li {width:585px; height:408px; float:left; box-sizing:border-box; padding:220px 20px 0;}
#venue > li:first-child {margin-right:30px;}
#venue .v_hotel {background:url('../images/main/venue.jpg') no-repeat left top;}
#venue .venueBox {height:188px; background:#fff; border-bottom:5px solid #d90039; box-sizing:border-box; text-align:center; padding-top:47px;}
#venue .v_map {background:url('../images/main/venue_map.jpg') no-repeat left top;}
#venue .v_map .add {border-color:#07357d; padding-top:50px;}
#venue .v_map .add .mDetail {width:150px; height:42px; line-height:40px; text-align:center; text-decoration:none; border:1px solid #666; font-size:13px; font-weight:700; letter-spacing:1px; display:inline-block; color:#333; box-sizing:border-box; margin-top:20px;
border-radius:4px;
-webkit-border-radius:4px;
-moz-border-radius:4px;}
#venue .v_map .add .mDetail:hover {background:#333; border:1px solid #333; color:#fff;}

/*banner*/
#banner {width:100%; min-width:1200px; padding:50px 0; background:#eee;}
#banner > ul {width:1200px; margin:0 auto; overflow:hidden;}
#banner > ul > li {float:left;}
#banner > ul .bTitle {color:#111; font-weight:700; letter-spacing:2px; padding-right:30px; margin-right:30px; background:url('../images/common/spLine.gif') no-repeat right;}
#banner > ul .bLogo { font-weight:300; font-size:14px; letter-spacing:1px;}

/* Sponsor scrolling animation */
.sponsor-scroll {
    width: 800px;
    overflow: hidden;
    white-space: nowrap;
}

.sponsor-track {
    display: inline-block;
    animation: scroll-sponsors 15s linear infinite;
}

.sponsor-track img {
    display: inline-block;
    height: 60px;
    margin-right: 40px;
    vertical-align: middle;
}

@keyframes scroll-sponsors {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/*footer*/
#footer {width:100%; min-width:1200px; padding:20px 0; background:#3a3a3a; position:relative; z-index:9999; text-align: center;}
#footer > div {width:1200px; margin:0 auto; color:#ccc; font-size:15px; line-height:180%;}
#footer > div > strong {color:#fff; font-weight:400; display:block;}
#footer > div > a {color:#ccc; font-size:15px;}
#footer .footer-credit {color:#ccc;}


/*sub visual*/
.sCopy {top:180px !important;}

#snb {width:1200px; margin:0px auto 30px;}
#snb > ul {overflow:hidden;}
#snb > ul > li {width:33.3%; height:60px; margin-left:-1px; float:left;}
#snb > ul > li:first-child {margin-left:0;}
#snb > ul > li > a {height:60px; line-height:58px; text-align:center; text-decoration:none; border:1px solid #d0d0d0; box-sizing:border-box; display:block; position:relative; z-index:1;}
#snb > ul > li > a:hover {border:1px solid #999; color:#111; background:#f9f9f9; z-index:2;}
#snb > ul > li.on > a {background:#07357d; border:1px solid #111; color:#fff; z-index:2;}
.snb4 > li {width:25% !important;}
.snb2 > li {width:50% !important;}
.snb8 > li {width:50% !important;}

/* Center sub-navigation for venue pages */
#snb .snb8 {display:flex; justify-content:center; align-items:center;}
#snb .snb8 > li {width:200px !important; margin:0 10px;}
#snb .snb8 > li > a {text-align:center; font-weight:500; transition:all 0.3s ease;}
#snb .snb8 > li > a:hover {background:#f0f0f0; color:#07357d !important;}
#snb .snb8 > li.on > a {background:#07357d; color:#fff !important; border-color:#07357d;}

/* Center sub-navigation for program pages */
#snb .snb3 {display:flex; justify-content:center; align-items:center;}
#snb .snb3 > li {width:250px !important; margin:0 10px;}
#snb .snb3 > li > a {text-align:center; font-weight:500; transition:all 0.3s ease;}
#snb .snb3 > li > a:hover {background:#f0f0f0; color:#07357d !important;}
#snb .snb3 > li.on > a {background:#07357d; color:#fff !important; border-color:#07357d;}

/* Center sub-navigation for submission pages */
#snb .snb2 {display:flex; justify-content:center; align-items:center;}
#snb .snb2 > li {width:200px !important; margin:0 10px;}
#snb .snb2 > li > a {text-align:center; font-weight:500; transition:all 0.3s ease;}
#snb .snb2 > li > a:hover {background:#f0f0f0; color:#07357d !important;}
#snb .snb2 > li.on > a {background:#07357d; color:#fff !important; border-color:#07357d;}

/* PARTICIPATE dropdown specific styles */
#header .head .gnb > li > ul.s3 {min-width:220px; width:220px;}
#header .head .gnb > li > ul.s3 > li > a {padding:12px 20px; font-size:13px; white-space:nowrap; word-wrap:normal; overflow:hidden; text-overflow:ellipsis;}


/*sub container*/
#subContainer {width:100%; min-width:1200px; position:absolute; top:470px; left:0; z-index:9998;background: linear-gradient(to bottom, #f1f5f9 0%, #e2e8f0 100%);}
#sContainer {margin:0 120px 20px; min-height:500px; padding-top:35px; padding-bottom:20px;}

@media all and (max-width:1200px) {
	#sContainer {margin:0 !important;}
}

#sContainer .title {text-align:center; margin-bottom:20px; position:relative;}
#sContainer .title h2 {font-size:40px; color:#111; font-weight:500; line-height:100%; margin-bottom:10px;}
#sContainer .title > ul {display:inline-block;}
#sContainer .title > ul > li {font-size:14px; color:#888; padding:0 20px; background:url('../images/common/locationDot.gif') no-repeat left; float:left;}
#sContainer .title > ul > li:first-child {background:url('../images/common/home.gif') no-repeat left; padding-left:22px;}
#sContainer .title > ul .here {color:#333;}

/* Content Language Toggle */
.content-language-toggle {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.content-language-toggle .lang-btn {
    color: #666;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 5px 10px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.content-language-toggle .lang-btn:hover {
    color: #07357d;
    background-color: #f0f4ff;
}

.content-language-toggle .lang-btn.active {
    color: #07357d;
    background-color: #e6f0ff;
    font-weight: 600;
}

.content-language-toggle .lang-separator {
    color: #ccc;
    font-size: 12px;
}

/*sub contents*/
#sContents {width:1000px; margin:0 auto;}
#sContents h3 {font-size:20px; font-weight:700; letter-spacing:2px; color:#07357d; line-height:100%; margin-bottom:20px;}
#sContents h5 {font-size:16px; font-weight:700; letter-spacing:2px; color:#1148d2; line-height:100%; margin-bottom:10px;}
#sContents .txtBox {margin-bottom:70px;}
.onlineBtn {padding:0 50px; height:56px; line-height:56px !important; border:3px solid #666; text-align:center; text-decoration:none !important; font-weight:500 !important; font-size:17px !important; letter-spacing:1px; color:#444 !important; display:inline-block; border-radius:10px;
-webkit-border-radius:10px;
-moz-border-radius:10px;}
.onlineBtn:hover {color:#fff !important; border-color:#333; background:#333;}


/*committee*/
.commiList {border-top:1px solid #e3e3e3;}
.commiList > li {padding:17px 0 17px 25px; border-bottom:1px solid #e3e3e3; background-position:12px 22px; margin-bottom:0;}
.commiList > li > span {width:250px; display:inline-block; color:#111; font-weight:500; letter-spacing:1px; background:url('../images/sub/committeeLine.gif') no-repeat right; margin-right:20px;}

/*speakers*/
.slideTable {overflow:hidden; padding:45px 50px; border:1px solid #ddd; box-sizing:border-box; margin-bottom:20px;}
.slideTable > ul > li {}
.slideTable > ul > li ul.spSlide {}
.slideTable > ul > li ul.spSlide:after {display:block; clear:both; content:""; height:0;}
.slideTable > ul > li ul.spSlide > li {float:left;}
.slideTable > ul > li ul.spSlide li.spPhoto {width:137px; margin-right:35px;}
.slideTable > ul > li ul.spSlide li.spTxt {width:726px;}
.slideTable > ul > li ul.spSlide li.spTxt > strong {font-size:18px; color:#c50000; display:block; font-weight:500;}
.slideTable > ul > li ul.spSlide li.spTxt > p {font-size:20px; font-style:italic; color:#07357d; margin-bottom:20px;font-weight:500;}
.slideTable > ul > li ul.spSlide li.spTxt > div > strong {font-size:18px; display:inline-block; color:#333; font-weight:500; line-height:100%; margin-bottom:5px; padding-bottom:2px; border-bottom:1px solid #333;}
.slideTable > ul > li ul.spSlide li.spTxt > div {font-size:16px; margin-bottom:20px;}

.slideTable > ul > li ul.spSlide li.spTxt > a {width:100px; height:30px; line-height:30px; display:inline-block; background:url('../images/sub/readMore.png') no-repeat 10px #999; padding-left:28px; box-sizing:border-box; color:#fff; font-size:12px; font-weight:500; text-decoration:none;}
.slideTable > ul > li ul.spSlide li.spTxt > a:hover, .slideTable > ul > li ul.spSlide > li.spTxt > a.on {background-color:#666;}
.slideTable > ul > li .answer {width:898px; padding:25px 40px 28px; font-size:15px; line-height:170%; background:#f5f5f5; margin-top:20px; display:none; box-sizing:border-box;}


.clickTable td > a {width:100px; height:30px; line-height:30px; display:inline-block; background:url('../images/sub/readMore.png') no-repeat 10px #999; padding-left:28px; box-sizing:border-box; color:#fff; font-size:12px; font-weight:500; text-decoration:none;margin-top:10px;}
.clickTable td > a:hover, .clickTable td > a.on {color:#FFF; background-color:#666;}
.clickTable td > .detailview {width:100%; padding:25px 40px 28px; font-size:15px; line-height:150%; background:#f5f5f5; margin-top:20px; display:none; box-sizing:border-box;}
.clickTable td > .detailview > span {font-size:18px; font-weight:700; line-height:170%; letter-spacing:2px; color:#07357d;}
.clickTable td > img {width:45%; border:3px solid #dddddd; margin:10px 10px 10px 0px;}

/*accommoeation*/
.accHotel {overflow:hidden; margin-bottom:80px;}
.accHotel > li {padding-left:39px; margin-left:40px; border-left:1px solid #ddd; float:left; text-align:center;}
.accHotel > li > img {width:280px;}
.accHotel > li:first-child {padding-left:0; margin-left:0; border-left:0;}
.accHotel > li > p {margin:20px 0; color:#07357d; font-size:18px; letter-spacing:1px; font-weight:500;}
.accHotel > li > a {width:280px; height:40px; line-height:38px; text-align:center; text-decoration:none; display:block; font-size:13px !important; font-weight:500 !important; color:#333 !important; letter-spacing:2px; box-sizing:border-box; border:1px solid #666; text-transform:uppercase;}
.accHotel > li > a:hover {background:#333; border:1px solid #111; color:#fff !important;}

/*submission*/
.day {border:1px solid #ddd; padding:30px; font-size:30px; color:#07357d; font-weight:500; text-align:center;}
.day > p {color:#333; font-size:20px;}
/*venue*/
.venueTxt {font-size:20px; color:#333;}
.attraction > li {width:235px; float:left; text-align:center; font-weight:600; padding-left:20px;}
.attraction > li:first-child {padding-left:0px;}
.attraction > li > img {margin-bottom:15px;}


#sContainer .gallery img{width:190px;float:left;padding:5px;cursor:pointer}

/* Hotel booking page styles */
.hotel-list {
    margin: 20px 0;
}

.hotel-item {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}

.hotel-item:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

.hotel-item h4 {
    color: #07357d;
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 600;
}

.hotel-item p {
    margin-bottom: 8px;
    line-height: 1.6;
    color: #555;
}

.hotel-item strong {
    color: #07357d;
    font-weight: 600;
}

#nav-laser {
    display: none; 
    position: absolute; 
    bottom: 0; 
    height: 4px; 
    background: #0af; 
    box-shadow: 0 0 12px rgba(0,170,255,0.9), 0 0 24px rgba(0,170,255,0.6); 
    transition: all 0.25s ease;
    pointer-events: none;
}
.gnbon .gnb > li > a {position:relative}
.gz-silhouette {position:absolute; left:0; bottom:0; width:100%; min-width:1200px; height:120px; pointer-events:none;}

#home-topics {position:relative;}
.home-topics-wrap {padding:30px 0; background: linear-gradient(to bottom, #f1f5f9 0%, #e2e8f0 100%);}

.notice-success { padding:10px; border:1px solid #4caf50; background:#e8f5e9; color:#2e7d32; margin-bottom:15px; }
.notice-error { padding:10px; border:1px solid #f44336; background:#ffebee; color:#c62828; margin-bottom:15px; }
.list-indent { margin:8px 0 0 18px; }

.hidden { display:none; }
.grid-span-all { grid-column: 1 / -1; }
.grid-span-3 { grid-column: 1 / span 3; }
.w-280 { width:280px; }
.flex-1 { flex:1; }
.ml30 { margin-left:30px; }
.mt10 { margin-top:10px; }

.w-240 { width:240px; }
.overflow-x-auto { overflow-x:auto; }
.inline-block { display:inline-block; }
.w-220 { width:220px; }
.cursor-pointer { cursor:pointer; }
.flex { display:flex; }
.header-gap { align-items:flex-start; justify-content:space-between; gap:12px; padding:8px 0 12px; }
.h3-compact { margin:0; font-size:18px; }
.ml18 { margin-left:18px; }
.msg-box { padding:12px; border:1px solid #dee2e6; border-radius:6px; margin-bottom:16px; }
.w-180 { width:180px; }
.link-action { color:#0d6efd; text-decoration:none; }
.mr10 { margin-right:10px; }
.mb20 { margin-bottom:20px; }
.mb15 { margin-bottom:15px; }
.mt30 { margin-top:30px; }
.text-333 { color:#333; }
.text-666 { color:#666; }
.text-white { color:#fff; }
a.link-blue:hover, a.link-blue:focus, a.link-blue:visited, a.link-blue:link { color:#007bff; }
.btn-medium { padding:8px 16px; font-size:14px; }
.align-center { align-items:center; }
.gap12 { gap:12px; }
.captcha-img { border:1px solid #ccc; height:40px; cursor:pointer; }
.text-red { color:#c00; }
.font-13 { font-size:13px; }
.font-20 { font-size:20px; }
.minh-400 { min-height:400px; }
.text-center { text-align:center; }
.mb30 { margin-bottom:30px; }
.pill { display:inline-block; padding:4px 8px; border-radius:4px; }
.pill-muted { background:#e9ecef; }
.pill-info { background:#d7f0ff; }
.mr8 { margin-right:8px; }
.w-160 { width:160px; }
.mt8 { margin-top:8px; }