body{margin:0; font-family:'Segoe UI',sans-serif; background:#f4f4f4;}
.container{max-width:1600px; margin:0 auto; padding:30px 20px; text-align:center;}
.logo{display:flex; align-items:center; justify-content:center; margin-bottom:30px;}
.logo img{height:50px; margin-right:10px;}
.logo h1{font-size:1.8rem; color:#333; margin:0;}
.center-wrapper{display:flex; align-items:stretch;}
.center{flex:1; display:flex; flex-direction:column; height:100%; box-sizing: border-box;}
.center-top{height:260px; background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center;}

.center-info{color:white; text-align:center;}
.center-info h2{font-size:1.6rem; margin-bottom:10px;}
.center-info p{font-size:0.95rem; margin:10px 0;}
.go-btn-box{display:inline-flex; align-items:center; border:2px solid white; padding:8px 12px; background:transparent;}
.go-label{color:white; font-size:1.15rem; padding:8px 12px;}
.go-button{background:white; color:#0067B4; padding:6px 18px; border:none; border-radius:8px; font-size:1.25rem; font-weight:bold; cursor:pointer;}

.center-middle{display:flex; align-items:center; justify-content:center; gap:15px; padding:20px;}
.middle-label{color:white; font-size:1rem; white-space:nowrap;}
.status-box{display:flex; justify-content:center; align-items:center; background-color:white; border-radius:10px; text-align:center; width:100%; gap:10px; padding:15px 10px;}
.status-box-noEntry{display:flex; justify-content:center; align-items:center; background-color:lightgray; border-radius:10px; text-align:center; width:100%; gap:10px; padding:15px 10px;}
.status-box .emoji, .status-box-noEntry .emoji{font-size:2rem; height:40px;}
.status-box .emoji img, .status-box-noEntry .emoji img{width:40px;}
.status-text{font-size:1.25rem;}

.status-text-smooth{color:#0ca313;}
.status-text-Crowded{color:#ff9a13;}
.status-text-veryCrowded{color:#ff0000;}
.status-text-noEntry{font-size:0.825rem; text-align:left; color:#ff0000;}

.center-bottom{padding:20px; display:flex; flex-direction:column; gap:10px;}
.height-bottom{height:calc(100vh - 60vh); overflow-y:auto;}
.height-bottom::-webkit-scrollbar{width:10px;}
.height-bottom::-webkit-scrollbar-thumb{background:#ccc; border-radius:3px;}

.notice-row{display:flex; justify-content:space-between; align-items:stretch; border-radius:12px;}
.notice-left{background:white; text-align:left; padding:10px; flex:1; border-top-left-radius:12px; border-bottom-left-radius:12px; width:80%;}
.notice-left .title{font-weight:bold; font-size:1.15rem;}
.notice-left .date{font-size:1.15rem; color:#555;}
.notice-right{display:flex; justify-content:center; align-items:center; padding:10px 15px; border-top-right-radius:12px; border-bottom-right-radius:12px; font-size:0.85rem; font-weight:bold; white-space:nowrap; width:20%;}

.notice-row-none{display:flex; justify-content:center; align-items:center; padding:10px; height:100%;}
.notice-none{display:flex; justify-content:center; align-items:center; font-size:1.25rem; color:gray; padding:10px; border-radius:12px; width:100%; height:100%;}

.apply-noPreiod-btn{background:#3b3b3b; color:#ffffff; cursor:not-allowed;}

footer{margin-top:20px; font-size:0.8rem; color:#666; text-align:center;}

.bg-AS            {background-color:#0067B4;}
.color-AS		  {color:#0067B4;}
.bg-AS-bottom     {background-color:#2198f3;}
.bg-AS-btn		  {background-color:#0067B4; color:#fff; cursor:pointer;}
.bg-AS-view-btn   {background-color:#2863db; color:#fff; cursor:pointer;}
.bg-AS-notice	  {background:#d6e9f8;}

.bg-ASseo         {background-color:#7030A0;}
.color-ASseo	  {color:#7030A0;}
.bg-ASseo-bottom  {background-color:#9933ff;}
.bg-ASseo-btn	  {background-color:#7030A0; color:#fff; cursor:pointer;}
.bg-ASseo-view-btn{background-color:#dd37c0; color:#fff; cursor:pointer;}
.bg-ASseo-notice  {background-color:#dbbff8;}

.bg-ASsy		  {background-color:#006666;}
.color-ASsy		  {color:#006666;}
.bg-ASsy-bottom   {background-color:#008080;;}
.bg-ASsy-btn	  {background-color:#006666; color:#fff; cursor:pointer;}
.bg-ASsy-view-btn {background-color:#199110; color:#fff; cursor:pointer;}
.bg-ASsy-notice	  {background:#a4dbdb;}

.d-none{display:none;}

a:link{text-decoration:none; color: inherit;}
a:visited{text-decoration:none; color: inherit;}
a:hover{text-decoration:none; color: inherit;}
a:active{text-decoration:none; color: inherit;}
a:focus{text-decoration:none; color: inherit;}

@media (max-width: 1920px){
	.height-bottom{height:calc(100vh - 72vh); overflow-y:auto;}
}

@media (max-width: 1024px){
	.inro-title{font-size:1.45rem !important;}
	.center-wrapper{flex-direction:column;}
    .center{width:100%;}
	.height-bottom{height:230px; overflow-y:auto;}

	.notice-left .title{font-size:0.925rem;}
	.notice-left .date{font-size:0.925rem;}
}

@media (max-width: 640px){
	.notice-left .title{font-size:0.825rem;}
	.notice-left .date{font-size:0.825rem;}
	.notice-left{width:83%;}
	.notice-right{width:17%;}
}

@media (max-width: 440px){
	.inro-title{font-size:1.15rem !important;}
}