@charset "utf-8";

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/NotoSansKR-Light.woff2) format('woff2'),
       url(../fonts/NotoSansKR-Light.woff) format('woff'),
       url(../fonts/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url(../fonts/NotoSansKR-Medium.woff2) format('woff2'),
       url(../fonts/NotoSansKR-Medium.woff) format('woff'),
       url(../fonts/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 700;
   src: url(../fonts/NotoSansKR-Bold.woff2) format('woff2'),
        url(../fonts/NotoSansKR-Bold.woff) format('woff'),
        url(../fonts/NotoSansKR-Bold.otf) format('opentype');
}
 @font-face {
   font-family: 'atit4';
   font-style: normal;
   font-weight: 700;
   src: url(../fonts/NotoSansKR-Bold.woff2) format('woff2'),
        url(../fonts/NotoSansKR-Bold.woff) format('woff'),
        url(../fonts/NotoSansKR-Bold.otf) format('opentype');
}



/* **** Common Reset **** */
*{margin:0;padding:0;list-style:none;font-family: "Noto Sans KR",sans-serif;font-weight:300;box-sizing: border-box;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5{margin:0;padding:0;word-wrap:break-word;word-break:break-all;}
b, strong{font-weight:700;color: inherit;font-size: inherit;}
font{font-weight:700;font-size:inherit;}
input,select,img{vertical-align:middle;outline: 0;}
img{border:0;}
table{width:100%;}
table caption{position: absolute;top: 0px;left: 0px;overflow: hidden;display: block !important;width: 0px !important;height: 0px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
a{display:inline-block;text-decoration:none;transition:all 0.2s ease-in-out;}
i{font-style:normal;}
table {border-collapse: collapse;width: 100%;table-layout:fixed;}
select{border-radius:4px;background: url(../images/common/select-bg.png) no-repeat right 10px center #211e1c;border:none;font-weight:300;font-size:14px;width:130px;height:30px;line-height:30px;padding-left:10px;padding-right:35px;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-appearance: none;appearance: none;border: 1px solid #504a46;}
select::-ms-expand { display: none;}
pre{word-break:break-all;white-space: break-spaces;}
.clear{clear:both;}
.clearfix::after{content:"";display:block;clear:both;}
.blind {position: absolute;top: 0px;left: 0px;overflow: hidden;display: inline-block !important;width: 1px !important;height: 1px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}

.text-left{text-align:left !important;}
.text-center{text-align:center !important;}
.text-right{text-align:right !important;}

.header{background:url(../images/holiday_bg.png) no-repeat center/cover;height:319px;}
.width-auto{max-width:1200px;margin:0 auto;padding: 0 10px;box-sizing: content-box;}
.width-auto::after{content:"";clear:both;display:block;}

.red-font{color:#ff0000 !important;}
.blue-font{color:#3531c1 !important;}

/* header */
.gwangjing-go{position:absolute;top:30px;;}
.gwangjing-go a{display: flex;align-items: center;justify-content: center;font-size: 18px;font-weight: 500;color: #fff;width:200px;height:40px;border:1px solid #fff;}
.gwangjing-go a::before{content:"";display:inline-block;vertical-align: middle;width:30px;height:25px;background:url(../images/logo.png) no-repeat;margin-right: 10px;}
.header .tit{font-size: 50px;font-family: "atit4";font-weight: 700;color: #fff;text-align: center;padding-top: 55px;line-height: 1.5;text-shadow: 9px 6px 0 #212c4f;}
.header .tit strong{color:#ffd55e;}
.header .date{display: flex;align-items: center;justify-content: center;margin-top: 10px;}
.header .date::before{content:"";display: inline-block;width:94px;height:92px;box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);background: url(../images/date.png) no-repeat;border-radius: 50%;position: relative;left: 44px;}
.header .date p{font-size: 26px;font-weight: 700;color: #fff;background: #e74a71;height: 54px;line-height: 54px;padding: 0 35px 0 60px;border-radius: 30px;}


/* nav */
.nav-box{margin-top:-30px;padding-bottom: 13px;}
.nav-box ul{display:flex;justify-content: center;}
.nav-box ul li{width: 270px;margin: 0 5px;}
.nav-box ul li a{position:relative;display:block;height:59px;line-height:59px;text-align:center;font-size: 24px;font-weight: 700;color: #ffffff;background: #af9678;border-radius: 30px;}
.nav-box ul li a.on{background:#d7005f;}
.nav-box ul li a.on::after{content:"";position:absolute;bottom: -26px;left:calc(50% - 17px);width:0;height:0;border:13px solid transparent;border-top-color:#d7005f;}


/* common */
.content{padding-bottom:100px;}
h2.h2-tit{display: flex;align-items: center;font-size:30px;font-weight:700;color:#222;margin-top: 30px;}
h2.h2-tit:first-of-type{margin-top:0;}
h2.h2-tit .btn{margin-left:10px;}

.btn{font-size:18px;font-weight:300;color:#fff;height:30px;line-height:30px;padding:0 15px;background: #4362b2;border-radius: 5px;}
.btn.target::after{content:"";display:inline-block;background:url(../images/target.png) no-repeat;width:16px;height:16px;margin-left: 10px;vertical-align: -1px;}

.circle-list > li{position:relative;font-size:18px;font-weight:300;color:#222;padding-left: 22px;margin-top: 10px;}
.circle-list > li::before{content:"";position:absolute;top: 5px;left:0;width:16px;height:16px;border:1px solid #222;border-radius:50%;}
.circle-list > li .btn,
.line-list > li .btn{margin-left:10px;vertical-align: -1px;}

.line-list > li{position:relative;font-size:18px;font-weight:300;color:#222;padding-left: 10px;margin-top: 10px;}
.line-list > li::before{content:"";position:absolute;top: 13px;left:0;width: 5px;height: 2px;background: #222;}

.posi-num > li{position: relative;font-size:18px;font-weight:300;color:#125ac6;padding-left: 20px;}
.posi-num > li > .num{position: absolute;top: 0;left: 0;}

.flex-list > li{display: flex;justify-content: flex-start;}

.blue{color:#125ac6;}


/* tab-wrap */
.tab-wrap{display:none;} 
.tab-wrap.active{display:block;}
.tab-wrap .width-auto{padding-top:40px;}
.tab-wrap .title{display: flex;justify-content: center;align-items: center;height:198px;border-bottom: 2px dotted #b6b6b6;padding-top: 20px;}
.tab-wrap .title::before{content:"";display:inline-block;background-position:center;background-repeat:no-repeat;margin-right: 15px;}
.tab-wrap .title p{font-weight:300;font-size:24px;color:#222222;text-align: center;}
.tab-wrap .title p strong{display:block;font-weight:700;font-size:46px;color:#d7005f;line-height: 1;}

.tab-wrap .title2{display: flex;justify-content: center;align-items: center;height:198px;border-bottom: 2px dotted #b6b6b6;padding-top: 20px;}
.tab-wrap .title2 p{font-weight:300;font-size:24px;color:#222222;text-align: center;}
.tab-wrap .title2 p strong{display:block;font-weight:700;font-size:46px;color:#d7005f;line-height: 1;}


.table-style{border-top:2px solid #565656;margin-top:15px;overflow-x: auto;}
.table-style > table{table-layout:fixed;min-width:680px;}
.table-style th{background:#f8f8f8;color:#222222;font-weight:500;height:75px;}
.table-style tr > *{border-bottom:1px solid #dbdbdb;padding:20px;font-size:18px;}
.table-style tr > * + *{border-left:1px solid #dbdbdb;}
.table-style td{color:#222222;}
.table-style td > b{display:block;}


/* tab */  
/* #tab0 .title::before{background-image:url(../images/holiday_icon1.png);width:96px;height:92px;} */
/* #tab1 .title::before{background-image:url(../images/holiday_icon2.gif);width:96px;height:92px;} */
/* #tab2 .title::before{background-image:url(../images/holiday_icon3.gif);width:96px;height:92px;} */
/* #tab3 .title::before{background-image:url(../images/holiday_icon4.gif);width:96px;height:92px;} */

@media screen and (max-width:1024px){
	.header{height:auto;padding:50px 20px;}
	.header .tit{font-size:30px;}
	.header .date::before{width:60px;height:59px;background-size:100%;left:0;}
	.header .date p{font-size:18px;height:40px;line-height:40px;padding:0 20px 0 50px;margin-left:-40px;}

	.nav-box ul li a{font-size:20px;height:50px;line-height:50px;}

	.tab-wrap .title{height:auto;padding-bottom:20px;}
	.tab-wrap .width-auto{padding-top:20px;}
	.tab-wrap .title p{font-size:18px;}
	.tab-wrap .title p strong{font-size:22px;} 

	h2.h2-tit{font-size:20px;}
	.btn{font-size:14px;line-height:25px;height:25px;padding:0 10px;}
	.btn.target::after{width:10px;height:10px;background-size:100%;}
	
	.posi-num > li, 
	.circle-list > li, 
	.line-list > li{font-size:14px;padding-left:15px;margin-top:5px;}
	.circle-list > li::before{width:10px;height:10px;}

	.table-style tr > *{font-size:14px;padding:10px;}
	.table-style th{height:45px;}
}
@media screen and (max-width:680px){
	.header{height:auto;padding:50px 0;}
	.header .tit strong{display:block;}
	.header .date p{font-size:14px;}

	.gwangjing-go a{font-size:14px;width:180px;}
	
	 .nav-box ul {
    display: block;              /* flex 대신 block */
    overflow-x: auto;            /* 가로 스크롤 허용 */
    white-space: nowrap;         /* 줄바꿈 방지 */
	  }
	 
	  .nav-box ul li {
	    display: inline-block;       /* 가로로 나열 */
	    width: auto;                 /* li 크기 자동 */
	    margin: 0 5px;
	  }
	
	  .nav-box ul li a {
	    font-size: 14px;             /* 모바일 글자 크기 */
	    padding: 0 15px;             /* 양쪽 여백 */
	  }
}

@media screen and (max-width:450px){
	h2.h2-tit{flex-direction: column;}
	.nav-box{margin-top:-20px;}
	.nav-box ul li a{font-size:13px;height:40px;line-height:40px;}
	.flex-list > li{flex-direction: column;}
}

/* 서브탭 네비게이션 */
.sub-tab-nav ul {
  display: flex;
  justify-content: center;
  margin-top: 15px;
}
.sub-tab-nav ul li {
  margin: 0 5px;
}
.sub-tab-nav ul li a {
  display: block;
  padding: 12px 20px;
  background: #af9678;
  color: #fff;
  border-radius: 32px;
  font-weight: 600;
  font-size: 20px; 
  text-align: center; 
  word-break: keep-all;
}
.sub-tab-nav ul li a.on {
  background: #d7005f;
}

/* 서브탭 컨텐츠 */
.sub-tab-wrap {
  display: none;
  margin-top: 20px;
}
.sub-tab-wrap.active {
  display: block;
}
