@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2') format('woff2');
    font-weight: 400;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2') format('woff2');
    font-weight: 500;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 600;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-9Black.woff2') format('woff2');
    font-weight: 900;
}

/* Common */
 * {outline:0 !important;}
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}
html, body{width:100%;}
/*html{-webkit-touch-callout:none; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}*/
body{width:100%; background:#fff; min-width:320px; -webkit-text-size-adjust:none;word-wrap:break-word;word-break:break-all;font-weight: 500;}
body,input,select,textarea,button {border:none;font-size:18px; font-family: 'Paperozi' !important;color:#222222;}
ul,ol,li{list-style:none; }
table{width:100%;border-spacing:0;border-collapse:collapse;}
img,fieldset{border:0;}
address,cite,code,em{font-style:normal;font-weight:normal;}
/*label,img,input,select,textarea,button{vertical-align:middle; cursor:pointer;}*/
.hide,caption,legend{line-height:0;font-size:1px;overflow:hidden;}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:#000;text-decoration:none !important;}
br{font-family:"돋움",Dotum !important;}

:root {
    --orange: #fb612e;
    --blue: #0a4bcc;
    --dark: #1E1E1E;
    --white: #ffffff;
	--border: #e2e8f0;
 }

 
/* Form */
textarea { border:1px solid #dbdbdb;}
select { height:32px; font-size:13px; color:#373737; border:1px solid #e9e9e9; background:#fff;border-radius: 5px;}
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file], 
input[type=url],
input[type=number],
input[type=date],textarea {height:40px; font-size:13px; color:#555; border:1px solid #e9e9e9; background:#fff; border-radius: 5px; transition: all 0.5s; vertical-align:middle;}
input::-webkit-input-placeholder{color:#b5b5b5; font-size:12px; line-height:100%;}
textarea { padding:5px 0;}
select:focus,
textarea:focus,
input:focus { border: 1px solid #727272;}

input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly], 
input[type=search][readonly], 
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{background:#eaeaea; border-color:#c0c0c0; color:#666; -webkit-appearance:none;font-size:12px;}
textarea[readonly],
textarea[disabled]{font-size:14px; color:#666; font-weight:normal; line-height:140%; height:78px; background:#eaeaea;border:1px solid #c0c0c0;}

.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}

.align-center{text-align: center;}
.align-left{text-align: left;}
.align-right{text-align: right;}


.font-mj{font-family: 'NotoSerifKR', serif !important;}
.font-wt{font-weight: bold !important;}
.font-red{color: #FF0000;}
#daumRoughmapContainer1747355434148{ font-family:'Paperozi';}
.root_daum_roughmap .cont{display: none !important;}

.font-noto{ font-family: 'Noto Sans KR', sans-serif;}

/* CSS Document */

#wrap {
   margin: 0 auto;
  }
header {
   display: flex !important;
   justify-content:center;
   width: 100%;
   z-index: 20;
   /*background:#ffffff;
   box-shadow: 5px 2px 5px rgba(91, 91, 91, 0.45);*/
}

.fixed {
	position: fixed!important;
	animation: fixedd .5s 0s 1 ease-in-out forwards;
}
.fixed.roll {
    background: #ffffff;
	box-shadow: 5px 2px 5px rgba(91, 91, 91, 0.45);
 }

h1{display: flex;}

.navbar {
    padding: 0.8rem;
    width: 70% !important;
    display: flex !important;
    justify-content: space-between !important;
}
#top-nav .logo {position: absolute;left:3%; padding-top: 0.8em;}
#top-nav .openbtn, #top-nav .closebtn{ display: none;}

.container{ margin: 0 auto;}
.navbar-collapse{justify-content: center;}
.navbar-nav li{list-style-type:none;margin-right: 3rem !important;font-size: 20px; font-weight: 600; font-family: 'Paperozi';}
.navbar-nav li a:hover{color: #44af35;}
.navbar-nav li i{display: none;}

.nav-item:hover .dropdown-menu{
	display: block !important;
}

.dropdown-menu{
	display: none;
    animation: menuAni 0.5s;}

@keyframes menuAni {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }

}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .show>.nav-link,
.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
    color: #003173 !important;
}

.nav-item{margin-right:1.5rem !important }
.nav-item a{color: #333;}
.dropdown-item{font-size: 18px; line-height: 1.6em;}
.dropdown-menu{background-color:#fff !important;border: 0 !important;border: 2px solid #333333 !important;}
.dropdown-menu a{color: #333333;width: 97%;margin: 0 auto;text-shadow: 0 0 BLACK;font-family: 'Pretendard-Regular';}
.dropdown-menu a:last-child{ border-bottom: 0 !important;}
.dropdown-item:hover, .dropdown-item:focus {
  color: #fff !important;
  text-decoration: none;
  background-color: #333333 !important;
  width: 100%;
}

.top_sns{display: flex; /*padding-top: 1.2em;*/}
.top_sns li{ padding: 0 0.2em;}
.navbar-nav .sns-btn{display:none;}

.login{right:3%;top:50%;}
.btnlogin{border: 2px solid #004aad;
  border-radius:5px;
  background-color: #051a41;
  color: #ffffff;
  padding: 4px 8px;
  font-size: 14px;
  cursor: pointer;
  display: inline-block;
}
.btnlogin:hover{
  background: #ffffff;
  color: #018fd9;
}
aside{position: absolute;top: 40%;right: 0;width: 4%;text-align: center;}
.side-sns{position: fixed;}
.side-sns .go_sns{margin: 1em 0.5em;width: 60px; height:60px; background: #004aad; border-radius:50%;}
.side-sns .go_sns a{color: #fff; font-size:1.6em;}
.side-sns .go_sns i{ margin-top:0.7em;}
.side-sns .go_univ{width: 64px;height:72px;background: #004aad;color: #fff;padding: 10px;border-radius: 5px;line-height: 15px;font-size: 13px;} 
.side-sns .go_univ a{color: #fff;}
.side-sns .go_univ i{font-size: 32px; display: block;}
.side-sns .go_univ span{font-size: 10px;}
.menu_univ{display: none;}


.btnenter{border: 2px solid #21006e;
  border-radius:5px;
  background: #21006e;
  color: white;
  padding: 1% 2%;
  font-size: 18px;
  cursor: pointer;
  margin: 2em 0;
}

.btnenter:hover{border: 2px solid #21006e;
  background-color: white;
  color: #21006e;
}
.btnenter i{padding-left: 1em;}

.toggler_cont {
  display: inline-block;
  cursor: pointer;
}

.bar1, .bar2, .bar3 {
  width: 30px;
  height: 2px;
  background-color: #003173;
  margin: 6px 0;
  transition: 0.4s;
}

.change .bar1 {
  transform: translate(0, 9px) rotate(-45deg);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  transform: translate(0, -9px) rotate(45deg);
}


/* 메인페이지 */
/*#main-visual .carousel-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(2, 17, 84, 0.5) 100%);
    z-index: 1;
}*/
#main-visual .carousel-item {
    width: 100%;
    height: 100vh; /* 반드시 높이를 지정해야 배경이 보입니다! */
    background-size: cover;
    background-position: center;

    background-repeat: no-repeat;
}
#main-visual .carousel-item .btn-lg{font-size: 1rem;}
.main_bg01{background: url("../images/main02.webp") no-repeat; background-size: cover;}
.main_bg02{background: url("../images/main.webp?ver=1.3") no-repeat; background-size: cover;}

.main_bg01 .text{font-family: 'Paperozi'; font-weight: 900; font-size: 7vmin;color: #ffffff;text-shadow: 2px 1px 0px black; margin-top:0.5em !important;}

.carousel-caption h3 {
    font-size: 6vmin;
    font-weight: 600;
    color: #003b8a;
    letter-spacing: -1px;
	margin-bottom: 0.5em;
	text-shadow: 1px 1px 1px #ffffff;
}

.carousel-caption h5{font-size: 4vmin; color: #000000; margin-top: 1em; font-weight: 600;}
.carousel-caption h5 .badge{font-size: 3.4vmin;color: #000000;font-weight: 600;}

#main_btn{width: 100%;/* position: absolute; */right: 0;/* bottom: 13%; */display: flex;cursor: pointer;justify-content: center;margin-top: 5em;}
#main_btn li{margin-right: 0.5em;}
#main_btn li:last-child{margin-right:0 !important;}
.btn-circle{
	background: #cfb17c;
	color: #5e3c00;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.btn-circle02{
	background: #ffffff;
	color: #5e3c00;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.btn-circle:hover, .btn-circle02:hover{
	background: #003173;
	color: #ffffff;
}

.blue-btn-circle{
	background: #004668;
	color: #ffffff;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.blue-btn-circle02{
	background: #ffffff;
	color: #004668;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.blue-btn-circle:hover, .blue-btn-circle02:hover{
	background: #005d82;
	color: #ffffff;
}

.main_title{position: absolute;top: 10em;display: flex;flex-direction:column;text-align: center;width: 100%;}

/*#main_date{background: #2d956b;}
#main_date ul{display: flex;justify-content: center;}
#main_date .shot{ background: rgba(39, 39, 39, 0.26);}
#main_date li{width: 20%;/border-radius: 0;padding: 2em;font-size: 16px;text-align: center;color: #ffffff;}
#main_date li:last-child{ border-right: none;}
#main_date li:hover{color: #ffffc9;}
#main_date p{font-weight: 600;font-size: 28px;font-family: 'Paperozi';display: flex;justify-content: center;align-content: flex-end;align-items: center;}
#main_date p i{font-size: 36px;margin-right: 5px;}*/
/* 기본 레이아웃 프레임 */
#main_date {
  width: 100%;
  background: linear-gradient(135deg, #3ca887 0%, #2b9375 100%);
  padding: 25px 20px; /* 위아래 여백을 살짝 늘려 폰트 크기에 맞춤 */
  box-sizing: border-box;
}

/* 2. 내부 메뉴 리스트 레이아웃 (PC: 5열) */
.menu-list {
  list-style: none;
  padding: 0;
  margin: 0;
  /*max-width: 1200px;*/
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  /* 기존 gap(간격)을 없애고 경계선으로 밀착시킵니다 */
  gap: 0; 
}

/* 3. 개별 메뉴 아이템 및 경계 라인 추가 */
.menu-item {
  text-align: center;
  cursor: pointer;
  padding: 15px 10px;
  transition: background-color 0.2s ease;
  position: relative; /* 경계선 배치를 위한 기준점 */
}

/* PC버전 메뉴 사이 경계선 추가 (마지막 메뉴 제외) */
.menu-item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 40px; /* 경계선 세로 길이 */
  background-color: rgba(255, 255, 255, 0.3); /* 은은한 화이트 반투명 라인 */
}


/* 4. 텍스트 및 아이콘 스타일 (PC버전 폰트 크기 확대) */
.menu-item p {
  margin: 0;
  display: inline-flex; /* PC에서는 가로 나열 및 밑줄 최적화 */
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: #ffffff;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -0.5px;
  transition: color 0.25s ease-in-out, font-size 0.25s ease-in-out, font-weight 0.25s ease-in-out;
  position: relative;
  padding-bottom: 4px;
}

.menu-item p i {
  font-size: 30px;
  color: #ffffff;
  display: inline-block;
  vertical-align: middle;
  transition: color 0.25s ease-in-out, font-size 0.25s ease-in-out;
}

.menu-item:hover p {
  color: #d9fff4;       
}

/* 호버 시 내부 아이콘도 글자색/크기에 맞춰 연동되도록 설정 */
.menu-item:hover p i {
  color: #d9fff4;        /* 아이콘 색상도 연두빛으로 매칭 */
}

#main_info:before{
	top: 0;
	content: '';
	height: 100%;
	width: 100%;
	background: url('../images/maininfo_bg.webp') bottom no-repeat;
	position: absolute;
	display: block;
	z-index: 0;
	right: 0;
	background-size: 100%;
}
#main_info{text-align: center;background: #a7d6ea;position: relative;padding: 7em 0;}
#main_info h3 {
    font-size: 6vmin;
    font-weight: 800;
    color: #1a0b90;
    letter-spacing: -1px;
    display: flex;
    flex-direction: column;
    margin-bottom: 0.3em;
}
#main_info h3 span{font-size: 3vmin;color: #013863;font-weight: 600;}

.poster_info{padding: 5em;background: #ffffff;/*display: block;*/border-radius: 1em;}
.poster_info h4{font-family: 'Paperozi';  color: #5706d3; text-align: center; font-size: 5vmin; margin-bottom: 10px; text-shadow: none !important; font-weight: 600;}
.poster_info h4:before {content: open-quote; color: #a6a6a6; font-family:'Paperozi';}
.poster_info h4:after {content: close-quote; color: #a6a6a6; font-family:'Paperozi';}
.poster_info p { color: #ffffff; font-size: 2.2vmin; padding-bottom: 2em; text-align: center; line-height: 1.3em;}

.poster_cont{display: flex;}
.poster_cont .left {text-align: center;}
.poster_cont .left img{width: 100%; border-radius: 10px;box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 5px;}
.poster_cont .right div{ width: 96%;}
.poster_cont .right dd div{width: 100% !important;}

.sub_cont .poster_info{padding: 1em 0;background: #ffffff;}

.info_txt{font-size: 16px;line-height: 28px;display: flex;align-items: center;justify-content: end;}
.info_txt dl{display: flex;flex-direction: row;border-bottom: 1px solid #d5d5d5;align-items: baseline;padding: 0.3em 0;}
/*.info_txt dl:last-child{margin-bottom: 0 !important;}*/
.info_txt dt{width: 120px;height: 35px;background:#231781;/* padding: 10px 0; */color: #fff;/* border-radius: 5px; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 5px;font-size: 16px;}
.info_txt small{font-size: 18px !important; line-height: 19px !important;}
.info_txt dd{padding: 0.6em;text-align: left;margin-bottom: 0;line-height: 1.5em;width: 100%;}
.bullet-list {
    list-style: none; /* 기본 불릿 기호 제거 (커스텀 컨트롤을 위해) */
    padding: 0;
    margin: 0;
}

.bullet-list li {
    position: relative;
    padding-left: 12px; /* 불릿이 들어갈 공간 확보 (들여쓰기 효과) */
    line-height: 1.6;
	word-break: keep-all;
}

/* li 태그 앞에 가상 요소로 • 불릿 기호 삽입 */
.bullet-list li::before {
    content: "•";
    position: absolute;
    left: 0; /* padding-left로 비워둔 가장 왼쪽 공간에 고정 */
    top: 0;
    color: #333333; /* 불릿 색상 */
}



.red_txt{background: #d02e28; color: #fff; padding: 1em 0; text-align: center; font-size: 14px; line-height: 20px;} 

/* 전체 섹션: 소프트 민트/블루 배경 적용 */
.process-section {
  width: 100%;
  background-color: #f3f8f6; 
  padding: 80px 20px;
  box-sizing: border-box;
  position: relative;
}
.process-section::before{
			content: '';
            position: absolute;
            top: 80px;
            left: 50px;
            height: 310px;
			width: 280px;
            background: url("../images/bg_soodal.png") no-repeat;
			opacity: 0.1;
			z-index: 1;
}
.process-section::after{
			content: '';
			position: absolute;
			bottom: 0;
			right: 1%;
			height: 310px;
			width: 280px;
			background: url("../images/bg_soodal02.png") no-repeat;
			opacity: 0.1;
			z-index: 1;
}

.process-main-title {
  text-align: center;
  font-size: 32px;
  font-weight: 800;
  color: #1b4d3e; 
  margin: 0 0 50px 0;
}

.process-main-title::after {
  content: "";
  display: block;
  width: 45px;
  height: 4px;
  background-color: #2b9375; 
  margin: 12px auto 0 auto;
  border-radius: 2px;
}

.process-container {
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  position: relative;
  z-index: 2;
}

.process-card-wrap {
  flex: 1;
  min-width: 0; /* PC 레이아웃 균등 분할 깨짐 방지 */
}

/* --- 카드 디자인 세팅 --- */
.process-card {
  background-color: #ffffff;
  border: 1px solid #e1ede8;
  border-radius: 20px; 
  padding: 35px 15px 25px 15px;
  text-align: center;
  position: relative;
  transition: all 0.35s ease;
  box-shadow: 0 10px 25px rgba(43, 147, 117, 0.04);
  box-sizing: border-box;
}

.step-badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #3ca887 0%, #2b9375 100%);
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 14px;
  border-radius: 30px;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 10px rgba(43, 147, 117, 0.25);
  white-space: nowrap;
}

.icon-wrap {
  width: 55px;
  height: 55px;
  background-color: #f0f7f4;
  color: #2b9375;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px auto;
  font-size: 24px;
  transition: all 0.3s ease;
  flex-shrink: 0;
}

.card-title {
  margin: 0 0 10px 0;
  font-size: 18px;
  font-weight: 700;
  color: #2c3e35;
  white-space: nowrap;
}

.card-date {
  margin: 0 0 20px 0;
  font-size: 13px;
  color: #71877e;
  font-weight: 500;
  line-height: 1.5;
  height: 42px; /* 날짜가 한 줄인 카드와 두 줄인 카드의 높이 통일 */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.card-date span {
  font-size: 12px;
  color: #e05656; 
  font-weight: 600;
}

.bottom-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  color: #8fa89e;
  text-decoration: none;
  padding: 6px 16px;
  border-radius: 30px;
  background-color: #fafdfc;
  border: 1px solid #e6f0ec;
  transition: all 0.25s ease;
  white-space: nowrap;
}

.bottom-btn i {
  font-size: 15px;
}

.process-arrow {
  color: #9bc4b6;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* PC 호버 이펙트 */
.process-card:hover {
  transform: translateY(-6px);
  border-color: #2b9375;
  box-shadow: 0 15px 30px rgba(43, 147, 117, 0.1);
}
.process-card:hover .icon-wrap {
  background-color: #2b9375;
  color: #ffffff;
}
.process-card:hover .bottom-btn {
  background-color: #2b9375;
  color: #ffffff;
  border-color: #2b9375;
}

#info_section {
  width: 100%;
  /* background-color: #f7f9fc; */ /* 바탕 소프트 그레이 배경 */
  padding: 60px 20px;
  box-sizing: border-box;
  background-color: #f2f7f5;
}

/* 시안의 메인 화이트 라운드 박스 */
.info-card-container {
  max-width: 1320px;
  margin: 0 auto;
  background-color: #ffffff;
  /* border: 1px solid #e9ecef; */
  border-radius: 24px;
  display: flex;
  /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02); */
  box-shadow: 0 15px 35px rgba(43, 147, 117, 0.06);
}

/* --- 좌측 고객센터 스타일 --- */
.cs-zone {
  flex: 1.1; /* 공지사항 영역과의 미세 비율 조정 */
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 40px 50px;
  position: relative;
}

/* 중앙 연한 세로 구분선 구현 */
.cs-zone::after {
  content: "";
  position: absolute;
  right: 0;
  top: 40px;
  bottom: 40px;
  width: 1px;
  background-color: #f1f3f5;
}

.cs-info h3, 
.notice-header h3 {
  margin: 0 0 16px 0;
  font-size: 20px;
  font-weight: 700;
  color: #1a1a1a;
}

.cs-info p {
  font-size: 18px;
  font-weight: 600;
}

.cs-info .cs-time {
  display: block;
  font-size: 14px;
  color: #868e96;
  line-height: 1.5;
  margin-top: 10px;
}

/* 미니 바로가기 아이콘 모음 */
.cs-shortcuts {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 14px;
}

.cs-shortcuts li {
  text-align: center;
  cursor: pointer;
}

.shortcut-box {
  width: 54px;
  height: 54px;
  background-color: #f8f9fa;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  transition: all 0.2s ease;
}

.shortcut-box i {
  font-size: 22px;
  color: #495057;
}

.cs-shortcuts li span {
  font-size: 13px;
  color: #495057;
  font-weight: 500;
}

/* 아이콘 호버 시 효과 */
.cs-shortcuts li:hover .shortcut-box {
  background-color: #e8f5e9; /* 연한 그린 스킨 힌트 */
}
.cs-shortcuts li:hover .shortcut-box i {
  color: #2b9375;
}


/* --- 우측 공지사항 스타일 --- */
.notice-zone {
  flex: 1;
  padding: 40px 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.notice-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.notice-header h3 {
  margin: 0;
}

.btn-more {
  font-size: 14px;
  color: #868e96;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
}

.notice-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.notice-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed #f1f3f5; /* 시안 특유의 점선 형태 구분선 */
}

.notice-list li:last-child {
  border-bottom: none;
}

.notice-title {
  font-size: 16px;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; /* 글자가 박스를 넘어가면 말줄임(...) 처리 */
  padding-right: 20px;
}

.notice-title:hover {
  color: #1a1a1a;
  text-decoration: underline;
}

.notice-date {
  font-size: 14px;
  color: #adb5bd;
  flex-shrink: 0; /* 날짜 영역 폭 고정 */
}

#spon{background: #f7f7f7;padding: 5em 0 4em 0;}

/*.sponsor{display: flex;}*/
.sponsor dl {display: flex;align-items: center;margin-bottom: 2em; flex-direction: column;}
.sponsor h4{font-weight: 600;font-size: 20px;color: #003173;}
.sponsor span{background: #003173;display: block;height: 2px;margin: 0.5em auto;overflow: hidden;position: relative;width: 30px;}
.sponsor h6{font-size: 16px; color: #666666;} 
.sponsor dd img{padding: 10px;}
.sponsor dt{font-size: 18px;margin-right: 5px;/* width: 90px; *//* background: aliceblue; */border-radius: 3px;color: #003173;;padding: .5em;text-align: center;}
.sponsor dd{width: 100%;display: flex;justify-content: center;flex-direction: row;padding-top: 0.5em;flex-wrap: wrap;}
/* //메인페이지 */



/* 서브페이지 */
#sub-visual{
	 background-color: var(--blue);
     height: 35vh;
     min-height: 280px;
     position: relative;
     overflow: hidden;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     color: var(--white);
     text-align: center;
     padding-top: 60px;
     z-index: 1;
}
.banner_heading{
	font-size: 42px;
    font-weight: 900;
    letter-spacing: -1px;
    text-transform: uppercase;
    margin-bottom: 5px;
} 
#sub-visual p {
    font-size: 16px;
    opacity: 0.8;
    font-weight: 500;
        }

.sub_logicon{position: absolute;left: 5%;top: 15%;}
.sub_banner{ display: flex; justify-content:center;}
.banner_heading{
	font-weight: 900;
	font-size: 5.5vmin;
	color: #ffffff;
	/* padding-top:3.5%; */
	text-transform: uppercase;
	text-shadow: 0px 2px 2px #000000;
} 
.banner_date{
	font-weight: 600;
	font-size: 1.4em;
	color: #ffffff;
	padding-top: 8.5%;
	text-shadow: 1px 1px 1px #111111;
	text-align: center;
} 

/* tab */
.subnav {width:100%;}
.subnav ul {width:100%; overflow:hidden;display: flex;justify-content: center;}
.subnav li {float:left;font-size: 16px;line-height:1.5em;font-weight:bold;color:#383838;text-align:center;overflow:hidden; position:relative;}
.subnav li a {display:block;padding: 20px 30PX;color: #8c8c8c;overflow:hidden;}
.subnav li a:hover{text-decoration:none;}

.subnav li a:hover { color: var(--orange); }
.subnav li.selected a {color: var(--orange); }
/* 활성화된 메뉴 하단 오렌지 바 강조 */
.subnav li.selected::after {
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            width: 100%;
            height: 3px;
            background-color: var(--orange);
}
.con_border {border-bottom: 1px solid #e2e2e2;width:100%;background: #ffffff;}

.sub_tab {
  overflow: hidden;
  border: 1px solid #8eabd3;
  background-color: #fff;
  margin: 2em 0;
}
.b_05 button{ width: 20%;}
.b_04 button{ width: 25%;}
.b_02 button{ width: 50%;}
.b_03 button{ width: 33.333%;}
.sub_tab button{
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 20px 0;
  transition: 0.3s;
  font-size: 18px;
  border-right: 1px solid #8eabd3;
}
.sub_tab button:last-child{border-right:none;}
.sub_tab button:hover {
  background-color: #F7F7F7;
}
.sub_tab button.active {
  background-color: #083e88;
  color: #fff;
}


/* //tab */

.sub-menu02{display: none;cursor: pointer;padding: 1em 0;}
.sub-menu02 span{color: var(--orange);font-size: 20px;font-weight: 600;}
.sub-menu02 .bi{font-size: 16px !important;}
.sub-menu02 i{float: right; padding-top: 5px; color: var(--orange);}
.sub-menu02 .subdrop-menu{display: none; border-bottom: 1px solid #ddd;background:#fff; border-radius: 0px; width: 100%; position: absolute;left: 0px; margin-top: 17px; z-index: 100;padding: 1.2em 0;}
.sub-menu02 .subdrop-menu li{ padding: 0.4em 1.2em; font-size: 18px;}
.sub-menu02 .subdrop-menu a{color: #666; text-decoration: none;}
.sub-menu02 .subdrop-menu li:hover{background: #fafafa;}

.subpage{padding: 5em 0;background: #f3f8ff;}
.heading-agileinfo {
    font-weight: 900;
    font-size: 5vmin;
    text-align: center;
    margin-bottom: 1em;
}
.sub_cont {word-break:keep-all;font-size: 16px;line-height: 30px;}
.sub_cont .row{margin: 0;}

.sub_tab {
  overflow: hidden;
  border: 1px solid #d8d8d8;
  background-color: #fff;
  margin: 2em 0;
}
.b_05 button{ width: 20%;}
.b_04 button{ width: 25%;}
.b_03 button{ width: 33.333%;}
.b_02 button{ width: 50%;}
.sub_tab button{
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 20px 0;
  transition: 0.3s;
  font-size: 18px;
  border-right: 1px solid #d8d8d8;}
.sub_tab button:last-child{border-right:none;}
.sub_tab button:hover {
  background-color: #F7F7F7;
}
.sub_tab button.active {
  background-color: #004aad;
  color: #fff;
}

.session_title{font-size: 30px; font-weight: 600; text-align: center; margin-bottom: 1em;}
.session_title span {
	background: #004aad none repeat scroll 0 0;
	display: block;
	height: 2px;
	margin: 10px auto 0.5em;
	overflow: hidden;
	position: relative;
	width: 50px;
}
.session_subtitle{text-align:center;font-weight:bold; margin-bottom:2em;}
.subtabcontent {
  display: none;
}
.subtabcontent h3{text-align: center;margin-bottom: 0.3em;font-size: 20px;color: #004aad;}
.subtabcontent table {
  border-collapse: collapse;
  width: 100%;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}

.subtabcontent th, .subtabcontent td {
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid #e5e5e5;
}
.subtabcontent th{ width: 25%; background: #F7F7F7; text-align: center;}
.subtabcontent details{color: #999; cursor: pointer;}
.subtabcontent details > summary {
  border: solid 1px #eee;
  margin-top: 1em;
  padding: 5px 10px;
  width: 76px;
  font-size: 14px;
  border-radius:5px;
}
.subtabcontent details ul{padding: 10px; width: 100%;}
.subtabcontent details li{display: flex;}
.subtabcontent details span {width: 10%; color: #636363;}
.subtabcontent details p{width: 90%;}
.subtabcontent details .s02 span {width: 18%;}
.subtabcontent details .s02 p{width: 82%;}


.place_txt{padding: 15px 0; border: 1px solid #b9a79f;background: #fffbf4; font-size: 20px; text-align: center; margin-top: 0.5em;}


.partner .row{margin: 0;}
.partner h3{font-size: 24px;}
.partner-list{padding-bottom: 2em;}
.partner-list li{border: 1px solid #bfd6f5;margin:0.5em 1em 0.5em 0 !important;width: 30%;text-align: center;padding: 1.5em 0;cursor:pointer;}
.partner-list li:hover{background: #f3faff;}
.partner-list li p{height: 39px; margin-bottom: 0 !important; display:flex; justify-content: center; align-items: center; font-size:20px;}


.year_bar{margin-bottom: 1em;width: 100%;text-align: end;}
.year_bar select {background: #000 url("/images/select_bg.jpg") no-repeat right;font-size: 16px;color: #fff;border: 0; border-radius:5px;padding: .7em;width: 240px; appearance:none;height: 50px;}

/* //서브페이지 */



footer {
	background: #222222;
	padding: 20px 0;
	text-align: center;
	color: #AAAAAA;
	font-size: 12px;
}
footer .footer-grid{ border-bottom: 1px solid #494949; padding-bottom: 1rem; }
.footer-grid ul{ display: flex; justify-content: space-around; margin-bottom: 1em; align-items:center;}
.footer-grid li a{display:block; padding:.5rem 1.25rem; background:#575757; color:#adb5bd; font-size:12px;margin-top:2em; border-radius: 2px;}
.footer-grid .copy{text-align: left; width: 65%; display: flex; justify-content: flex-start;}
.footer-grid .copy div{ margin-right: 1em;}
.footer-grid .copy span:after{width:0.5px;content:"|"; margin:0 5px;}
.footer-grid .copy span:last-of-type:after{display:none}

footer p{padding-top:1rem; text-transform:uppercase;}




/* 반응형 웹 */
@media only screen and (max-width: 1680px){
	#main_btn{width: 40%;}
}

@media only screen and (max-width: 1440px){
	.sub_logicon{ top:13%;}
	.sub_logicon img{width: 80%;}	
	.navbar{width: 95% !important;}
	#main_btn{width: 30%;}
	#sub-visual{padding-top: 10em; background-size: cover;}

}

@media only screen and (max-width: 1280px){
	.poster_info{padding: 4em 3em;}
	.main_bg01{background-position: left !important;}
	.main_bg02{background-position: right !important;} 
}
/* 테블릿 가로 */
@media (max-width: 1200px) {
  .process-section {
    padding: 60px 16px;
  }
  
  .process-container {
    flex-direction: column;
    gap: 0;
    align-items: center;
  }

  .process-card-wrap {
    width: 100%;
    max-width: 480px; 
  }

  /* 세로 가로 정렬 믹스 레이아웃 구조 */
  .process-card {
    padding: 28px 20px 20px 20px;
    display: flex;
    flex-direction: row;       
    align-items: center;       
    justify-content: flex-start;
    text-align: left;
    width: 100%;
  }

  .step-badge {
    left: 20px;
    transform: none;
    top: -12px;
  }

  /* 아이콘 찌그러짐 원천 차단 */
  .icon-wrap {
    margin: 0 15px 0 0;
    width: 48px;
    height: 48px;
    font-size: 20px;
  }

  /* 텍스트 독립 레이아웃 확보 */
  .card-info-group {
    flex: 1;          
    min-width: 0;     
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .card-title {
    font-size: 16px;
    margin: 0 0 3px 0;
  }

  .card-date {
    margin: 0;
    height: auto;
    display: block;   
    font-size: 13px;
    text-align: left;
  }
  
  .card-date span {
    display: inline-block;
    margin-top: 1px;
  }

  /* 버튼 밀림 및 두줄 깨짐 방지 */
  .bottom-btn {
    margin-left: auto; /* 우측 끝 정렬 */
    flex-shrink: 0;   
    padding: 8px 14px;
    font-size: 13px;
  }

  /* 가로 화살표 -> 세로 화살표 전환 */
  .process-arrow {
    padding: 10px 0;
    transform: rotate(90deg);
    color: #b3d4ca;
  }
}

@media only screen and (max-width: 1024px){
	.container { width: 90%; padding: 0;}   
	.side-sns{display: none;}
	.main_logicon{padding: 20px 20px 0 20px;}
	.navbar-nav li{font-size: 16px;}
	.navbar-expand-lg .navbar-nav .nav-link{padding-left: 0 !important; padding-right: 0 !important;}
	.info_txt{/* font-size: 16px; */word-break: keep-all;}
	.live_text .chat_area{width: 74% !important;}
	#main-visual{background-size: cover !important;}

   	.banner_heading{
	font-size:1.8em;
	padding-top:6%;
  	} 
	.banner_date{
	font-size:1.2em;
	padding-top:12%;
	line-height: 1.3em;
  	} 
	.sub_logicon{ top:16%;}
	.sub_logicon img{width: 60%;}
	.spon01{flex-wrap:wrap;}
	.sponsor{display: block;}
	.sponsor dl{display: block;text-align:center;margin-right: 0 !important;}
	.sponsor dt{margin-bottom:10px;}
	.spon_title dt{width: 120px;margin: .3em auto;}
	.sponsor dd{ text-align: center;}
	#main_btn{width: 100% !important;/* padding: 0.7em !important; */bottom: 20%;/* margin: 0 auto; */display: flex;justify-content: center;}
}



/* 테블릿 세로 */
@media only screen and (max-width:991px) {
	header {margin-bottom:1em;}
	#top-nav .logo{width:100%; text-align:center;left:0;}
	button{border: 0; background: none;}
	.navbar-nav{background: #fff !important; z-index: 50; border-radius: 5px;}
	.navbar-nav .sns-btn{display: block;border: 0 !important;text-align: right;padding-top: 0.8em;/* background: #eee; */}
	.navbar-nav{padding: 1em 0 !important;border: 1px solid #eee !important; margin-top: 0.5em;}
	.navbar-nav li{text-align: left; padding: 0 1em; border-bottom: solid #f1f1f1 1px; width: 95%; margin: 0 auto !important; font-size:18px !important; text-shadow:0 0 BLACK;}
	.navbar-nav li i{display: inline-block; position: absolute; right: 3%;}
	.navbar-light .navbar-nav .nav-link:hover,.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .show>.nav-link, .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.show,.navbar-light .navbar-nav .nav-link.active  {color: #003173 !important;}
	.nav-item a{color: #333333;}
	.dropdown-menu{background: #fcfcfc !important; width: 95% !important; margin: 0 auto 1em auto !important; border: 1px #f7f7f7 solid !important;}
	.dropdown-menu a{color: #333 !important;width: 100% !important;}
	#top-nav .openbtn, #top-nav .closebtn{ display: block;} 
	#top-nav{padding-top:1.8em}
	#top-nav .logo{padding-top: 0;}
	.top_sns{display: none;}
	.navbar-nav .sns-btn{display: block;border: 0 !important;text-align: right;padding-top: 0.8em;/* background: #eee; */}
	.banner_date{font-weight:600;
	font-size:1.5em;
	padding-top:8%;
	} 
	.poster_cont{display: flex;flex-direction: column;}
	.sub_cont02{padding: 50px 20px;}
	.main_bg01 .text{font-size: 42px !important; font-weight: 400;}
	.info-card-container {
    flex-direction: column; /* 가로 배열 구조에서 세로 적층형으로 변경 */
  }

  .cs-zone {
    flex-direction: row;
    padding: 30px;
  }

  /* 세로 전환 시 중앙 라인을 하단 경계선용으로 회전 */
  .cs-zone::after {
    right: 30px;
    left: 30px;
    top: auto;
    bottom: 0;
    width: auto;
    height: 1px;
  }

  .notice-zone {
    padding: 30px;
  }

}

@media only screen and (max-width: 800px) {
	.live{display:contents;}
	.main_logicon{padding: 0 5%;}
	#main_btn{ bottom: 5%;}
	.message h3{font-size: 18px;word-break: auto-phrase;line-height: 26px;}
	.live_vod, .main_live{ width: 100%; height: 400px;}
	.live_text{ width: 100%; margin-top: 0.2em;}
	.live_text .scroll{height: 300px;}
	.live_text .chat_area{width: 86% !important;}
	.live_text .chat_box{ height: 90px;}
	.main_title h3 img{width: 70%;}
	.main_title h2 img{width: 50%;}
	.main_title .date img{width: 60% !important;}
	.poster_txt{width: 80%;}
	#main_info h2{font-size: 2.5em;}
	.subtabcontent details li{display: block;}
	.subtabcontent details span {width: 100%;}
	.subtabcontent details p{width: 100%;}
	.subtabcontent details .s02 span {width: 100%;}
	.subtabcontent details .s02 p{width: 100%;}
	.intro-list img{width: 100%;}
	.banner_date{
	font-size:1em;
	padding-top:15%;
	line-height: 1.3em;
  	} 
	.side-menu{ padding: 0.8em 0;}
	.sub-menu01{display: none !important;}
	.sub-menu02{display: block; text-align: center;}
	.sub-menu02 select{width: 90%; border: 0;}
	.sub-menu02 select:hover{border: 0 !important;}
	.sub_logicon{ top:16%;}
	.sub_logicon img{width: 40%;}
	.info_txt dl{flex-direction:column; align-items: start; padding: 0.5em 0;}
	#sub-visual{background-size: cover !important; background: url("/images/mobile_sub.webp") no-repeat center bottom;}
	.footer-grid .copy{text-align: left;width: 50%; flex-direction:column;}
   .poster_cont .right div{ width: 100%; margin: 1em auto;}	
}



/* 모바일 */
@media (min-width: 769px) {
  .menu-item:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 40px; /* 라인 길이 */
    background-color: rgba(255, 255, 255, 0.3); /* 은은한 화이트 라인 */
  }
}

@media (max-width: 768px) {
	.sns{
	margin-right:1em;
	}
	.banner_heading{
	font-size:1.8em;
	padding-top:11%;
    
	} 
	.banner_date{font-weight:600;
		font-size:1em;
		padding-top:14%;
	} 
	#main_date {
    padding: 10px 15px; /* 모바일 맞춤 여백 */
  }

  .menu-list {
    grid-template-columns: repeat(6, 1fr); /* 6분할 베이스 */
    row-gap: 0; /* 세로 간격 없앰 (경계선 배치 때문) */
    column-gap: 0;
    position: relative; /* 모바일용 중앙 구분선 기준점 */
  }
	
	.menu-item p{flex-direction:column;}

  /* --- 모바일 메뉴 아이템 배치 --- */
  /* 1층: 앞의 2개 메뉴 (3 + 3 = 6) */
  .menu-item:nth-child(1),
  .menu-item:nth-child(2) {
    grid-column: span 3;
    /*padding-bottom: 25px;  가로 구분선과의 간격 */
  }

  /* 2층: 뒤의 3개 메뉴 (2 + 2 + 2 = 6) */
  .menu-item:nth-child(3),
  .menu-item:nth-child(4),
  .menu-item:nth-child(5) {
    grid-column: span 2;
    padding-top: 25px; /* 가로 구분선과의 간격 */
  }

  /* --- 🌟 모바일 전용 경계선 (신규 추가) --- */
  
  /* [PC용 ::after 경계선 비활성화] */
  .menu-item:not(:last-child)::after {
    display: none;
  }

  /* [모바일 1층 세로 경계선: 1번 메뉴 오른쪽] */
  .menu-item:nth-child(1)::before {
    content: "";
    position: absolute;
    right: 0;
    top: 20px; /* 패딩 고려 위치 조절 */
    bottom: 25px; /* 가로 구분선까지 */
    width: 1px;
    background-color: rgba(255, 255, 255, 0.3);
  }

  /* [모바일 2층 세로 경계선: 가운데 메뉴 기준 좌우] */
  /* 가운데인 4번 메뉴의 좌우에 라인을 그립니다. */
  .menu-item:nth-child(4)::before,
  .menu-item:nth-child(5)::before {
    content: "";
    position: absolute;
    top: 25px; /* 가로 구분선부터 */
    bottom: 20px; /* 패딩 고려 위치 조절 */
    width: 1px;
    background-color: rgba(255, 255, 255, 0.3);
  }
  .menu-item:nth-child(4)::before { left: 0; }
  .menu-item:nth-child(5)::before { left: 0; }

  /* [모바일 1층과 2층 사이 가로 구분선] */
  /* .menu-list의 가상 요소로 구현 */
  .menu-list::after {
    content: "";
    position: absolute;
    left: 20px; /* 좌우 여백 */
    right: 20px;
    top: 50%; /* 대략 중앙 위치 */
    height: 1px;
    background-color: rgba(255, 255, 255, 0.3);
    transform: translateY(-50%);
  }

  /* --- 모바일 글씨 및 아이콘 크기 (최적화) --- */
  .menu-item p {
    font-size: 15px;
    gap: 8px;
    font-weight: 500;
  }
  .menu-item p i {
    font-size: 22px;
  }
}

@media (max-width: 576px) {
  /* 해상도가 매우 좁은 초소형 모바일 화면 대응 */
  .cs-zone {
    flex-direction: column;
    align-items: flex-start;
    gap: 25px;
  }
  
  .cs-shortcuts {
    width: 100%;
    justify-content: flex-start; /* 좁은 폭 화면에서 균등 분할 배정 */
  }
}

@media only screen and (max-width:500px){
	.partner-list li{width: 100%; margin: 0.5em 0 !important;}
	.sponsor dd{flex-direction: column;}
	.sponsor dd img{padding: 0 0 10px 0;width:fit-content !important;margin: 0 auto !important;}
	.sponsor h6{word-break: keep-all;} 
	.poster_info{padding: 1em;}
	.info_txt dt{width: 98px;height: 33px;background: #003173;/* padding: 10px 0; */color: #fff;/* border-radius: 5px; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 5px;font-size: 16px;}
	.info_txt .long{width: 250px;height: 35px;background: #003173;/* padding: 10px 0; */color: #fff;/* border-radius: 5px; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 2em;font-size: 18px;}
	.sub_tab button{height: 50px; font-size: 16px; padding: 0;}
	#main_btn{width: 95% !important;bottom: 20%;display: flex;justify-content: center;margin: 5em auto;}
	#main_info{padding: 7em 0em;}
	.info_txt dd{padding: 0.5em;line-height: 24px; font-size: 16px;}
	.main_title h3 img{width: 80%;}
	.main_title h2 img{width: 60%;}
	.main_title .date img{width: 70% !important;}
	.btn-circle, .btn-circle02{
	width: 130px;
	height: 130px;
	border-radius: 50%;
	font-size: 20px;
	}
	.info_table th{font-size: 16px;} 
	.info_table td{font-size: 14px;line-height: 20px;}
	.handi{font-size: 16px; line-height:25px;}
	.hand_last{line-height: 18px; font-size: 14px;}
	.info_table h5{font-size: 16px;}
	.sub_cont h4{font-size: 22px;}
	.footer-grid ul{display: block;}
	.footer-grid .copy{text-align: center;width: 100% !important; margin-top: 0.5em;}
	.youtube-section {
	  display: flex;
	  justify-content: center;
	  flex-direction: column;
	}
	.summary h3{font-size:28px;}
	.poster_info{padding: 2em 1em;margin-top: 1em;}
	.main_bg01 .text{font-size: 24px !important;margin-top: 1em !important;letter-spacing: -1px;}
}


@media only screen and (max-width:480px){
	.logo img{width: 50%;}
	.live_vod, .main_live{height: 200px;}
	.live_text .chat_area{ width: 81% !important;}
	.chat_write_enter{padding: 2%;}
	.main_title{top: 20% !important;}
	#top-nav{ padding-bottom: 1em;} 
	.navbar{width: 100% !important;}
	#main_info h2{font-size: 1.5em;}
	#main_info h3{font-size: 1.4em;}
	#main_info h5{font-size: 0.9em; word-break: keep-all;}
	.poster_txt{width: 70%;padding: 1.5em;}
	.main_quick{top:-7.5em;}
	.main_quick li{font-size: 12px; padding: 1.5em 0;}
	.spon01{display: contents;justify-content: center;}
	.spon01 li{ margin-right: 0rem; margin-bottom: 1rem;}
	.spon01 h4{padding-top: 2em;}
	.session_title{font-size: 25px;word-break: keep-all;line-height: 32px;}
	.info_photo{display: block;}
	.info_photo .photo_name{padding-left: 5px;display:inline;}
	#sub-visual{padding-top: 5.7em;/* background-size: 100% !important; */height: 75vw;}
	.sub_logicon{ top:16%;}
	.banner_heading{
	font-size:1.2em;
	padding-top:23%;
    
	} 
	.banner_date{font-weight:600;
		font-size:0.8em;
		padding-top:34%;
	} 
	.btnenter{ padding: 2% 2%;}

}


@media only screen and (max-width:375px) {
	#top-nav h1{
		transform: none;
		font-size: 1.5em;
	}
	.navbar h1{ width: 75%;}
	#top-nav{ padding-bottom: 0.3em;} 
	/*.sub_tab button{font-size: 14px;}*/
	.live_text .chat_area{width: 78% !important;}
	/*#main-visual{height: 500px;}*/
	.main_quick{top:-5em;}
	#main_info{padding:4em 0em;}
	#main_info h2{font-size: 1.2em;}
	#main_info h3{font-size: 1.1em; letter-spacing: -1px;}
	#main_info h4 img{width: 55%; height: auto;}
	#main_info h5{font-size: 0.8em;}
	#main_info h2{padding:0.2em 0.1em;}
	.banner_heading{
	font-size:1.2em;
	padding-top:15%;
    } 
	.banner_date{font-weight:600;
	font-size:0.7em;
	padding-top:30%;
	}
	.heading-agileinfo{font-size: 32px;}
	.carousel-caption h5{font-size: 16px !important;}
	.carousel-caption p{width:95% !important;margin: 1.5em auto; font-size:14px !important;}
	.main-title {font-size: 22px;}
}

@media only screen and (max-width:320px) {
	.poster_txt{width: 80%;}
	.main_quick li{font-size: 11px;}
	/*#main-visual{height: 480px;}*/
	.banner_date{font-weight: 400;
	font-size: 0.6em;
	padding-top: 28%;
	} 
	.main_bg01 .text{font-size: 22px !important;}
}


