@charset "utf-8";

/*
  Project _ CSS Init
  FileName _ layout.css - (신규 공통 레이아웃(상/하단) 영역)
  Author _ 쮸양~★
  Date _ 2025. 07. 14
  Last _ 
*/

#wrap {position:relative; width:100%;}

/******************************************************************************************************************************************
	header CSS (상단스타일) - 쮸양~★
*******************************************************************************************************************************************/
#header {position:fixed; top:0px; left:0px; background:rgba(255,255,255,0.8); width:100%; height:150px; z-index: 100;}

/* 상단 탑 메뉴 */
.topMenuBox {position:relative; width:100%; z-index:20; box-sizing:border-box; background:#232733;}
.topMenuBox::after { position:absolute; bottom:0px; left:0px; content:""; width:100%; height:1px; background:rgba(255,255,255,0.3); display:block;}
.topMenu {position:relative; width:95%; max-width:1400px; margin:0px auto; height:45px; min-height:45px; display:flex; color:#fff; justify-content:flex-end; align-items:center; flex-wrap:wrap; z-index:20; box-sizing:border-box; overflow:hidden;}

/* 상단 탑메뉴(오른쪽) */
.topMenuBox .topRight {display:flex; align-items:center;}
.topMenuBox .topRight li {position:relative; color:#fff; font-size:13px; margin-right:10px;}
.topMenuBox .topRight li a {display:flex; align-items:center; color:#fff;}
.topMenuBox .topRight li i {margin-right:5px;}

.topMenuBox .topRight li:last-child{margin-right:0px;}


#top_layout .top_wrap {position:relative; width:100%; margin:0px auto; height:90px; padding:0 0px;}

#top_layout.on + .gnb_bg {display:block; z-index:99; }
#top_layout + .gnb_bg {display:none; position:fixed; top:50px; left:0; z-index:2; width:100%; height:100%; background:#000; opacity:0.5; content:''; transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out;}


/******************************************************************************************************************************************
	header_bottom CSS (메뉴수정) - 쮸양~★
*******************************************************************************************************************************************/
.header_bottom {position: relative; width: 100%; z-index:10;}
.header_bottom::after {content:""; position:absolute; bottom:-1px; left:0px; width:100%; height:1px; display:block; background:rgba(255,255,255,0.3);}

.innerBox {margin: 0 auto; max-width:1400px; width: 95%; display:flex;}

.header_bottom .logo {position:relative; width:228px; top:25px; left:0px; z-index:10;}
.header_bottom .logo a {display:block; width:100%; height:52px; text-indent:-99999px; background:url(../images/common/logo.png) no-repeat; background-position: left center; background-size:contain;}
.header_bottom .logoOpen a {display:block; width:335px; height:69px; text-indent:-99999px; background:url(../images/common/logo.png) no-repeat;background-position: left center;}

.header_bottom .menu_icon {position:relative; display:flex; align-items:center;}
.header_bottom .menu_icon a.siteGo {display: block; position: relative; width: 35px; height: 35px; padding: 4px;margin-left: 10px; text-indent:-9999px;}
.header_bottom .menu_icon a.siteGo span {display: block; position: absolute; top: 50%; left: 0; width: 100%; height: 3px; background-color: #fff; background-repeat: no-repeat; -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 1;}
.header_bottom .menu_icon a.siteGo span{background:#111;}

.header_bottom .menu_icon a.siteGo span:not(.line1) {width: 22px; -webkit-transition: all .3s; transition: all .3s;}
.header_bottom .menu_icon a.siteGo span.line1 {-webkit-transform: translateY(-9px) rotate(0); transform: translateY(-9px) rotate(0);}
.header_bottom .menu_icon a.siteGo span.line3 {-webkit-transform: translateY(7px) rotate(0); transform: translateY(7px) rotate(0);}
.header_bottom .menu_icon a.siteGo:hover span:not(.line1) {width: 100%; -webkit-transition: all .3s; transition: all .3s;}
.header_bottom .menu_icon a.siteGo.active span {-webkit-transition: all .3s; transition: all .3s; left: 50%;}
.header_bottom .menu_icon a.siteGo.active span.line1 {width: 100%; -webkit-transform: translate(-50%,0) rotate(45deg); transform: translate(-50%,0) rotate(45deg);}
.header_bottom .menu_icon a.siteGo.active span.line2 {opacity: 0; -webkit-transform: translate(-50%,0) rotate(45deg); transform: translate(-50%,0) rotate(45deg);}
.header_bottom .menu_icon a.siteGo.active span.line3 {width: 100%; -webkit-transform: translate(-50%,0) rotate(-45deg); transform: translate(-50%,0) rotate(-45deg);}

.header_bottom .menu_icon .menuGo {display:none;}


.header_bottom a.go_fullmenu {display: none;}
.header_bottom .siz800_gnblink {display: none;}


#top_menu {width:calc(100% - 228px);}
#top_menu p.menu_united {clear: both; float: left; border-left: 1px solid #5b757f; border-right: 1px solid #5b757f; height: 63px; background: url("/images/tour/main/op10.png") repeat scroll 0 0; width: 16%;}
#top_menu p.menu_united a {color: #fff; display: block; height: 30px; line-height: 30px; font-size: 17px; font-weight: 600; background: url("/images/tour/main/main_sprites.png") no-repeat -58px -390px; width: 130px; margin: 0 auto; padding: 17px 0 16px 0;}

/* 메뉴 */
#top_menu .gnb {width:100%; display:flex; justify-content:flex-end; margin-right:50px;}
#top_menu .gnb > li {width:calc(100% / 5 - 30px); text-align: center;}
#top_menu .gnb > li > a {display: block; font-size:22px; color: #111; font-weight:500; height:105px; line-height:106px; text-align: center;}
#top_menu .gnb > li > a:hover {color: #00a439 !important;}

.gnbA div {width: 100%; position: absolute; top:105px; left: 0; display: none; background:rgba(255,255,255,1); padding: 25px 0 25px 0; border-top: 1px solid rgba(0, 0, 0, 0.3); box-sizing:border-box; z-index:10;}
.gnbA div > span {display: none;}

.header_bottom .gnbA:hover div {display:flex;}
#top_menu .gnb .titleBox {text-align:right; padding-right:50px; width:calc(40% - 50px); position:relative; border-top: none; border-bottom: none;}
#top_menu .gnb .titleBox::after {position:absolute; right:25px; top:0px; width:1px; height:100%; content:""; background:rgba(0, 0, 0, 0.1);}
#top_menu .gnb .titleBox .title {font-size:25px; color:#111;}
#top_menu .gnb .titleBox .title >i {margin-right:5px; color:#00a439;}
#top_menu .gnb .titleBox .stxt {font-size:15px; color:#666; display:block; font-family:'paper'; font-weight:500;}
#top_menu .gnb ul { display:flex; flex-wrap:wrap; width:60%}
#top_menu .gnb ul > li {line-height: 22px;}
#top_menu .gnb ul > li a {display: block; text-align: left; color: #111; font-size:18px; border-radius:8px 0px; padding:10px 20px; margin:5px 5px; border: 2px solid rgba(0, 0, 0, 0.1);}
#top_menu .gnb ul > li a:hover {color: #00a439 !important; border: 2px solid rgba(0,164,57, 0.5);}

#top_menu .gnb .gnbA:hover > a {position:relative;}
#top_menu .gnb .gnbA:hover > a::after { content:""; width:100%; height:4px; position:absolute; bottom:0px; left:0px; background:#00a439; display:block;}

/* 모바일메뉴 */
.header_bottom_mobile {display:none;}


@media(max-width:769px) {
	#header {height:90px;}
	.header_bottom::after {display:none;}
	.header_bottom .menu_icon a.siteGo {display:none;}
	/* 전체보기메뉴 */
	.header_bottom .menu_icon .menuGo {display:block; width:36px; height:36px; text-indent:-1000em; background:url(../images/common/all_menu.png) no-repeat; cursor:pointer;background-size: 100%; border:none;}
	
	/* 상단메뉴 바로가기 */
	.topMenuBox {display:none;}
	
	/* 반응형메뉴 */
	#top_menu {display:none;}
	.innerBox { padding:20px 0px; /*justify-content:space-between;*/ width:95%;}
	
	.header_bottom .menu_icon {position:absolute; right:20px;}
	.header_bottom .logo {top:0px;}
	
	.header_bottom_mobile {position:fixed; top:0px; width:100%; height:100%; padding-top:90px; overflow:visible; background:rgba(255,255,255,0.8);}
	.header_bottom_mobile .logo {display:none;}
	.header_bottom_mobile .cittaslow_logo {display:none;}
	
	.header_bottom_mobile .innerBox {position: fixed; z-index:100; overflow: auto; display:block; overflow-y: scroll; -webkit-overflow-scrolling: touch; padding:0 !important; width:100%; height: 100%; margin: 0; border-radius: 0;}
	
	/* 상단탑메뉴 */
	.topMenuBox_mobile {position:relative; display:inline-block; width: 100%; padding:10px 20px; box-sizing:border-box; background:#00a439;}
	.topMenu {padding:0px 0px; justify-content:flex-start; min-height:auto;}
	.topMenu .topRight {display:flex;}
	.topMenu .topRight li {display:block; margin-right:10px; border:1px solid #fff; border-radius:5px;}
	.topMenu .topRight li i {margin-right: 5px;}
	
	.topMenu a {color:#fff; padding:2px 10px; display:block;}
	
	.header_bottom_mobile #top_menu_mobile {position: static; width:100%; height:auto; padding:20px 20px; background: #fff; border-radius:0px 0px 10px 10px; box-sizing:border-box;}
	#top_menu_mobile .gnb > li {position:relative; border-bottom:1px solid #ddd; margin-bottom:10px; width:100%; display:block; padding:5px 0px; font-size: 16px; font-weight: 500;}	
	#top_menu_mobile .gnb > li > a {background: url("../images/newMenu/gnbA_icon.png") no-repeat scroll 0 0; background-size:15px; font-size:16px; height: 17px; line-height: 17px !important; padding-left: 24px; display:inline-block;}
	
	#top_menu_mobile .gnb > li >i {margin-right: 5px;}
	
	#top_menu_mobile .gnb > li::before {position:absolute; top:0px; right:0; width:25px; height:25px; content:""; background:rgba(0,0,0,0.2); border-radius:100px;}
	#top_menu_mobile .gnb > li.on::before {background:#00a439;}
	#top_menu_mobile .gnb > li::after {position:absolute; top:0px; right:6px; width:13px; height:8px; margin-top:9px; background:url("../images/common/icon_dropdown.png") no-repeat 0 0px; transition:all 0.3s ease-out; content:''}
	#top_menu_mobile .gnb > li.on::after {transform:rotate(180deg); color: #00a439;}
	
	#top_menu_mobile .gnb li a:hover {color: #00a439 !important;}
	
	#top_menu_mobile .gnb > li > div {position:relative; top:10px; border:1px solid #ddd; border-left:none; border-right:none; border-radius:5px; background:#fafafa; padding:5px 20px; box-sizing:border-box;}
	
	#top_menu_mobile .gnbB {min-height:auto; padding-right:0px; padding:0px 0px; display:block;}
	#top_menu_mobile .gnbB li {clear:both; float:none; width:100%; border:none; border-bottom:2px dotted #eee; margin:5px 0px; padding:0px 0px; box-sizing:border-box;}
	#top_menu_mobile .gnbB li:last-child {border-bottom:none; margin-bottom:0px;}
	#top_menu_mobile .gnbB li a {position:relative; clear:both !important; width:100%; color:#414141 !important; padding:5px 0px 5px 12px; margin:0px 0px !important; line-height:17px; height:17px; text-align:left !important; background:none; display:block !important; font-size: 15px; font-weight: 400;}
	#top_menu_mobile .gnbB li a::before {content:""; position:absolute; top:8px; left:0px; width:5px; height:5px; display:block; background:#00a439; border:none; border-radius:10px 0px 10px 0px;}
	#top_menu_mobile .gnbB li > ul {margin:5px 0px;}
	#top_menu_mobile .gnbB li > ul {display:none; width:100%;}
	#top_menu_mobile .gnbB li > ul li {display:none;}
	#top_menu_mobile .gnbB1 li.gnbBs1 li.gnbCs1 a::before {display:none;}
	#top_menu_mobile .gnbB1 li.gnbBs1 li.on a {color:#00a439 !important;}
	
	#top_menu_mobile .gnbB1 li.gnbBs1 li.gnbCs1 a {}
	
	
}

@media(max-width:320px) {
	.header_bottom .logo {width:180px;}
	.header_bottom .menu_icon .menuGo {width:30px; height:30px;}
}



/******************************************************************************************************************************************
	quickMenu CSS (퀵메뉴 스타일) - 쮸양~★
*******************************************************************************************************************************************/
.quickMenuBox {position:absolute; right:5%; top:150px; width:146px; height:680px; z-index:30; background:url(/_themes/tour/images/common/quick_all.png) no-repeat 0px 0px; background-size:contain;}



/******************************************************************************************************************************************
	footer CSS (하단푸터 스타일) - 쮸양~★
*******************************************************************************************************************************************/
/* footer */
#footer_wrap {clear:both; z-index:11; background:#1c2a40;}
#footer_wrap .footer {width:100%; max-width:1400px; margin:0px auto; padding:20px 0px; box-sizing:border-box; padding-left: 220px; background:url("../images/common/foot_logo.png") no-repeat 0px center; background-size:175px 29px;}

.footer_menu {position:relative; display:flex; flex-wrap:wrap; padding:0px 0px 10px 0px; margin-bottom:10px;}
.footer_menu::after { position:absolute; bottom:0px; left:0px; content:""; width:100%; height:1px; background:rgba(255,255,255,0.2);}
.footer_menu li {padding-right:7px; margin-right:7px;}
.footer_menu li a {color:#fff; display:block; font-size:0.9em;}

#footer_wrap address {color:#fff; font-size:0.9em; font-weight:300;}
#footer_wrap address span {display:block;}
#footer_wrap address span.copyinfo {color:rgba(255,255,255,0.5);}
/* 하단이미지 변경 */
footer .footerImg { position:relative; width:100%; height:320px; background:url('../images/common/foot_winter.png') repeat-x center bottom;}
footer .footerImg.spring {background:url('../images/common/foot_spring.png') repeat-x center bottom;}
footer .footerImg.spring .txt {position:absolute; top:40%; left:5%; font-size:1.2em; color:#222; border-radius:50px; padding:10px 30px; background:#fff;}
footer .footerImg.spring .txt .point {color:#F66;}

footer .copyrights {overflow:hidden; background:#111111; padding:20px 20px; margin:0px auto;}
footer .copyrights .flogo {float:left; margin:30px 30px 30px 0; display:block; width:200px; height:40px; text-indent:-99999px; background:url('../images/common/f_logo.png') no-repeat}
footer .copyrights .footer_nav li {display:inline-block; position:relative; padding:5px 8px 5px 10px}
footer .copyrights .footer_nav li::before {content:""; position:absolute; left:0; top:12px; width:1px; height:10px; background:#898989}
footer .copyrights .footer_nav li a {display:block; font-size:0.9em; color:#fff}
footer .copyrights .footer_nav li a span {color:#004ea2}
footer .copyrights .footer_nav li:first-child {padding-left:0}
footer .copyrights .footer_nav li:first-child::before {display:none}
footer .copyrights .footer_info {font-size:0.9em; color:#fff;}
footer .copyrights .footer_info address {display:block; padding:0px 0; line-height:1.3}
footer .copyrights .footer_info small {font-size:0.9em; color:#888888;}
footer .copyrights .footer_info small a {text-decoration:none; color:#888888;}
footer .footer_qr {position:absolute; top:0; right:0}

@media all and (max-width:1400px) {
	#footer_wrap .footer {width:95%;}
}

@media all and (max-width:1025px) {
	#footer_wrap .footer {width:95%;}
}

@media all and (max-width:769px) {
	.footer_menu {justify-content:center;}
	#footer_wrap address {text-align:center;}
	#footer_wrap .footer {background: none; padding-left:0px; }
}


/* 배너바로가기 */
.banner_wrap {width:100%; display:inline-block; border-top:1px solid #eee; border-bottom:1px solid #eee;}
.banner_wrap .inner {position:relative; padding:0 0px 0 200px; box-sizing:border-box;}
.banner_wrap h2 {position:absolute; top:0px; left:0; width:180px; height:40px; line-height:40px; color:#333; font-size:16px; font-weight:400;}

.banner_wrap .control_box {position:absolute; top:0px; left:80px;}
.banner_wrap .control_box a {float:left; width:20px; height:40px; line-height:40px; text-align:center;}
.banner_wrap .control_box a span.icon {display:inline-block; height:11px; vertical-align:middle; text-indent:-99999px;}

.banner_wrap .control_box a.prev span.icon {width:11px; height:19px; background:url("../images/common/ic_bn_prev.png") no-repeat 0 0px;}
.banner_wrap .control_box a.next span.icon {width:11px; height:19px; background:url("../images/common/ic_bn_next.png") no-repeat 0 0px;}
.banner_wrap .control_box a.stop span.icon {width:8px; height:20px; background:url("../images/common/ic_bn_stop.png") no-repeat 0 0px;}
.banner_wrap .control_box a.start span.icon {width:8px; height:20px; background:url("../images/common/ic_bn_newplay.png") no-repeat 0 0px;}
.banner_wrap .slider_box {width:100%; display:inline-block; height:40px; overflow:hidden;}
.banner_wrap .slider_box ul li { position:relative; float:left; margin-right:45px; width:auto !important;}
.banner_wrap .slider_box ul li a {display:block; height:40px; line-height:40px; font-size:15px; color:#333333;}
.banner_wrap .slider_box ul li::before {position:absolute; top:50%; right:-22px; content:""; width:2px; height:2px; display:block; background:#333;}

.banner_wrap a.more {position:absolute; top:0px; left:150px; width:30px; height:40px; text-indent:-99999px; background:url("../images/common/ic_bn_all.png") no-repeat center center; background-size:17px;}

/******************************************************************************************************************************************
	quickMenu CSS (퀵메뉴 스타일) - 쮸양~★
*******************************************************************************************************************************************/
#quick{position:fixed; left:calc(50% + (1380px / 2) + 2em); bottom:2em; z-index:1000;}
#quick>i{position:absolute; right:0em; bottom:calc(100% - 1em); z-index:100; width:142px; height:161px;}
#quick>i>span:nth-child(1){background-image:url(../images/common/quick_top.png);}
#quick[data-quick="on"]>i{
	-webkit-animation-name:quick_bound_act;
	-webkit-animation-fill-mode:forwards;
	-webkit-animation-duration:1s;
	-webkit-animation-iteration-count:1;
	-webkit-animation-timing-function:linear;

	animation-name:quick_bound_act;
	animation-fill-mode:forwards;
	animation-duration:1s;
	animation-iteration-count:1;
	animation-timing-function:linear;
}
#quick>i>span:nth-child(1){
	position:absolute; left:0; top:0; width:142px; height:161px; background-position:0px 0px; background-repeat:no-repeat; background-size:contain;
	-webkit-animation-name:quick_bound;
	-webkit-animation-fill-mode:forwards;
	-webkit-animation-duration:1s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;

	animation-name:quick_bound;
	animation-fill-mode:forwards;
	animation-duration:1s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
}

#quick>ul {position:relative; width:142px;}
#quick>ul>li:not(:last-child){margin-bottom:2px;}

#quick>ul>li {position:relative; display:flex; justify-content:flex-end;}
#quick>ul>li>a{display:flex; align-items:center; justify-content:center; flex-direction:row; width:60px; height:60px; background-color:#f9f9f9; -webkit-border-radius:0 1em 1em 0; border-radius:60px; border:1px solid #eee;}
#quick>ul>li>a span.txt {display:none;}
#quick>ul>li>a:hover{background-color:#00a439; width:142px; height:60px; padding:0px 20px 0px 10px; justify-content:flex-end; border:1px solid #00a439;}
#quick>ul>li>a:hover span.txt {display:block; color:#fff; font-size:13px; text-align:right; line-height:1.3; margin-right:10px;}
/* 아이콘 */
#quick>ul>li>a i {width:36px; height:36px; display:block; background:url(../images/common/quick_icon.png) no-repeat 0px 0px;}
#quick>ul>li>a i.quick_ic01 {background-position:0px 0px;}
#quick>ul>li>a:hover i.quick_ic01 {background-position:0px -40px;}
#quick>ul>li>a i.quick_ic02 {background-position:-50px 0px;}
#quick>ul>li>a:hover i.quick_ic02 {background-position:-50px -40px;}
#quick>ul>li>a i.quick_ic03 {background-position:-100px 0px;}
#quick>ul>li>a:hover i.quick_ic03 {background-position:-100px -40px;}
#quick>ul>li>a i.quick_ic04 {background-position:-150px 0px;}
#quick>ul>li>a:hover i.quick_ic04 {background-position:-150px -40px;}
#quick>ul>li>a i.quick_ic05 {background-position:-200px 0px;}
#quick>ul>li>a:hover i.quick_ic05 {background-position:-200px -40px;}
#quick>ul>li>a i.quick_ic06 {background-position:-250px 0px;}
#quick>ul>li>a:hover i.quick_ic06 {background-position:-250px -40px;}

#quick>.topBtn {position:relative; padding-top:20px; display:flex; justify-content:flex-end;}
#quick>.topBtn::before {content:""; position:absolute; top:0px; right:30px; width:1px; height:50%; background:#eee; display:block;}
#quick>.topBtn a {background:#000846 url(../images/common/quickTop.png) no-repeat center 10px; background-size:22px 25px; color:#fff; width:60px; height:55px; font-size:13px; border-radius:20px 5px 20px 5px; display:flex; justify-content:center; align-items:flex-end; padding-bottom:5px; z-index:10;}


@-webkit-keyframes quick_bound_act {
	0%,100%{opacity:1;}
	80%,90%{opacity:0;}
	0%,100%{-webkit-transform:translate(0,0); transform:translate(0,0);}
	80%{-webkit-transform:translate(0,-20em); transform:translate(0,-20em);}
	90%{-webkit-transform:translate(0.5em,0.5em); transform:translate(0.5em,0.5em);}
}
@keyframes quick_bound_act {
	0%,100%{opacity:1;}
	80%,90%{opacity:0;}
	0%,100%{-webkit-transform:translate(0,0); transform:translate(0,0);}
	80%{-webkit-transform:translate(0,-20em); transform:translate(0,-20em);}
	90%{-webkit-transform:translate(0.5em,0.5em); transform:translate(0.5em,0.5em);}
}
@-webkit-keyframes quick_bound {
	0%,100%{-webkit-transform:translate(0,0); transform:translate(0,0);}
	50%{-webkit-transform:translate(-0.15em,-0.4em); transform:translate(-0.15em,-0.4em);}
}
@keyframes quick_bound {
	0%,100%{-webkit-transform:translate(0,0); transform:translate(0,0);}
	50%{-webkit-transform:translate(-0.15em,-0.4em); transform:translate(-0.15em,-0.4em);}
}

@media screen and (max-width: 1580px) {
	#quick{display:none;}
}
span.iblank {
    position: relative;
    display: inline-block;
    margin-left: 5px;
    width: 15px;
    height: 15px;
    text-indent: -9999px;}

span.iblank::after {
    position: absolute;
    width: 15px;
    height: 15px;
    display: block;
    top: 0px;
    left: 0px;
    content: "";
    background: url(../images/newBoard/ico_link.png) no-repeat 0px 0px;
    background-size: contain;}






/* calendar*/
.calendar_wrap {min-width: 1100px; width:100%; }
.calendar{/*margin-top:50px;*/}
.calendar .title_btn .btn_right {display:none;}
.calendar .mark{background:none; text-align:right;}
.calendar .ul_list li strong:after {display:inline-block; content:":"; margin:0 5px;}
.calendar .box {text-align:center;margin-bottom:10px; padding:15px;}
.calendar .box .control{margin-bottom:20px;}
.calendar .box .control button{width:16px; height:27px; vertical-align:middle;cursor: pointer;}
.calendar .box .control button.prev{background:url(/images/icon/calendar_control_prev.png) no-repeat; background-position:left 7px;}
.calendar .box .control button.prev:hover, .calendar .box .control button.prev:focus {background:url(/images/icon/calendar_control_prev_on.png) no-repeat; background-position:left 6px;}
.calendar .box .control button.next{background:url(/images/icon/calendar_control_next.png) no-repeat; background-position:right 6px;}
.calendar .box .control button.next:hover, .calendar .box .control button.next:focus {background:url(../images/icon/calendar_control_next_on.png) no-repeat; background-position:right 6px;}
.calendar .box .control strong				{display:inline-block; margin:0 5px; vertical-align:middle; }
.calendar .box .control strong .point		{font-size:34px; color:#5db626;}
.calendar .box .month_txt {font-size:30px;margin-bottom: 5px;font-weight: bold;}

.calendar .box .month_btn li {display: inline-block; float: none; width: auto;margin: 0;}
.calendar .box .month_btn li a {display:inline-block; width:43px; height:43px; line-height:43px; border-radius:50%; background:#dcdcdc; text-align:center; color:#444; font-size: 15px; margin:0 9px;}
.calendar .box .month_btn li a {display:inline-block; width:43px; height:43px; line-height:43px; border-radius:50%; font-size: 15px; margin:0 3px;}

.calendar .box .month_btn					{overflow:hidden;}
.calendar .box .month_btn li a:hover		{background:#323a45; color:#fff;}
.calendar .box .month_btn li.active a		{background:#5db626; color:#fff;}


.calendar .title_btn .btn_right {display:block;}
.calendar .box .month_txt {font-size: 42px;}
.calendar .box .month_btn li a {margin: 0 2px;}
.calendar .table-responsive { /*border-right:1px solid #ddd;*/}
.calendar .table {width: 100%; border:0; border-top: 1px solid #b3b3b3; border-bottom: 0; text-align: left;} 
.calendar .table .sun { color: #e81e25; }
.calendar .table thead{display:table-row-group; text-align: center;}
.calendar .table thead th					{padding:15px 3px; color:#333; background:#f7f7f7; line-height:14px; font-weight:normal;}
.calendar .table tbody tr{display:table-row;}
.calendar .table tbody td{display:table-cell; width: auto; vertical-align: top; position: relative;}
.calendar .table thead th, .calendar .table tbody td{width:14%;}
.calendar .table th, .calendar .table td{border:1px solid #e5e5e5;}
.calendar .table tbody td{height:120px; }
.calendar .table tbody td.empty { background: #f9f9f9; position: inherit;}
.calendar .table tbody td.today {color:#FFF; background:#D5F7B5; position:inherit; border:1px solid #a3d772;}
.calendar .table tbody td .day {padding: 15px 15px 2px 15px;}
.calendar .table tbody td .day strong {font-size:14px;}
.calendar .table tbody td .day .specialday { font-size:14px;}
.calendar .table .holiday .day .specialday { display: inline-block; margin-left: 3px; color: #e81e25; }
.calendar .table tbody td.vacation > div > a > strong {color:#e81e25;}
.calendar .table tbody td .memo {padding-bottom: 10px;margin-top: 3px;}
.calendar .table tbody td .memo li {text-align:left; padding-left: 3px; background: url(/images/common/dot_purple.jpg) no-repeat; background-position: left 7px; line-height: 1.3; letter-spacing: -0.3px; font-size: 12px; }
.calendar .table tbody td .memo li {padding:3px 0px 3px 3px;}
.calendar .table tbody td .memo li.bgc1 {background:#ffc1cc;}
.calendar .table tbody td .memo li.bgc2 {background:#fffacd;}
.calendar .table tbody td .memo li.bgc3 {background:#b0e0e6;}
.calendar .table tbody td .memo li.bgc4 {background:#ffdab9;}
.calendar .table tbody td .memo li.bgc5 {background:#e8f5dc;}
.calendar .table tbody td .memo .chkok		{display:inline-block; width:50px; height:50px; text-align:center; background:#FFF; border-radius:50%; border:2px solid #6ab425; color:#6ab425; font-size:12px; line-height:50px;}
.calendar .table tbody td .memo .chkno		{display:inline-block; text-align:center; background:#f51f09; border-radius:3px; color:#FFF; font-size:12px; padding:2px 5px;}

.calendar .table tbody td .allNotice {font-size:11px;overflow: hidden;position: absolute;bottom: 15px; left: 13px;}
.calendar .table tbody td .allNotice span {display:inline-block;letter-spacing: -0.3px; background:none; padding-left:0; color:#595959;}
.calendar .table tbody td .allNotice span:nth-child(even) {background: url(/images/icon/calendar_bar.jpg) no-repeat; background-position: 3px 2px; padding-left:8px;}
.calendar .table tbody td .allNotice span strong {display:inline-block; margin-right:4px; color: #222;}
.calendar .table tbody td .work {margin-top:0;}
.calendar .table tbody td .work span {font-size:12px; display: block;}
.calendar .table tbody td .work img {float:left; margin-right:10px;position: relative; top: 0;}
.calendar .table .sun {color:#e81e25;}
.calendar .table .holiday .day {font-weight:bold; color:#e81e25;}
.calendar .table .holiday .day strong {font-size:13px; color:#e81e25;}
.calendar .table .holiday .day .specialday {display:inline-block; font-size:13px; margin-left:3px; color:#e81e25;}
.calendar .table .sta{color:#0c52a1;}
.calendar .table .sta .day strong {color:#0c52a1;}


@media screen and (max-width: 750px) {
.calendar_wrap { width: 100%; min-width: 100%; }
.calendar .table-responsive{border-right:0}
.calendar .table{margin:0; border-bottom:1px solid #d2d2d2; min-width: 100%;}
.calendar .table thead{display:none;}
.calendar .table tbody tr{width:100%;}
.calendar .table tbody td{position:relative; display:block; width:100%; height: 100%; border-top:1px solid #e5e5e5; color:#4d4c4c; font-size:13px;}
.calendar .table tbody td > strong{}
.calendar .table tbody td > a{display:block; width:100%; height:100%; color:#4d4c4c;}
.calendar .table tbody td a:focus, .calendar .table tbody td a:hover{text-decoration:underline;}
.calendar .table tbody td .day span { display: contents; }
.calendar .table tbody td.empty {  display: none;}
.calendar .table tbody td.today { background: #5db626;}
.calendar .table tbody td.day strong {color:#000; font-size:16px;}
.calendar .table tbody td .day span {font-size: 13px; font-weight: bold; color: #000;letter-spacing: -0.6px;}
.calendar .table tbody td .work {margin-top: 10px;}
.calendar .table tbody td .work img {position:absolute; right:0;top: 15px;}
.calendar .table tbody td .work span {font-size:12px; /*display:inline-block;*/ color:#000;}
.calendar .table tbody td .work .data {font-weight:bold;}
.calendar .table tbody td .work .phase {margin-left: 3px;}
.calendar .table tbody td .memo {color:#32004b; font-size:11px; margin: 3px 0 5px;}
.calendar .table tbody td .memo li {padding-left:8px; background: url(/img/common/dot_purple.jpg) no-repeat; background-position: left 5px; line-height: 1.3; letter-spacing: -0.3px;}
.calendar .table tbody td .allNotice {font-size:11px; color:#a7a7a7;overflow: hidden;bottom: 0px; left: 0px; position: relative;}
.calendar .table tbody td .allNotice span {display:inline-block;letter-spacing: -0.3px; background: url(/img/common/calendar_bar.jpg) no-repeat; background-position: 3px 2px; padding-left:8px;}
.calendar .table tbody td .allNotice span:first-child {background:none; padding-left:0;}
.calendar .table tbody td .allNotice span strong {display:inline-block; margin-right:4px;}

.calendar .box .month_btn li {display:block;float: left;width: 32.8%;margin-right: 0.5%;margin-bottom: 0.5%;}
.calendar .box .month_btn li a {display:block; width:100%; height:35px; line-height:35px; border-radius:0; background:#ededed; text-align:center; color:#666; font-size: 13px; margin:0px;}
}



/* 달력 팝업 */
.poptitle { position: relative; border-top: 2px solid #111; padding: 10px 10px; border-bottom: 2px dashed #ddd; background: #fafafa; display: flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
.poptitle .tit {font-size: 18px; min-width: 180px;}
.pop_option_tbl table {border-top:1px solid #111; border-bottom: 1px solid #ddd; margin-top: 10px;}
.pop_option_tbl thead th {font-size: 18px; text-align: center; color: #111; padding: 10px 0px; margin-top: 10px; background: #f5f5dc; border-bottom: 1px solid #111;}
.pop_option_tbl tbody {width:100%; padding-bottom: 5px;}
.pop_option_tbl tbody tr {display: flex; flex-wrap:wrap; padding: 5px 10px;}
.pop_option_tbl tbody tr:not(:first-child) {border-top:1px dotted #666;}
.pop_option_tbl tbody tr.hide {display: none;}
.pop_option_tbl td {width:100%;}
.pop_option_tbl td.sdetail {position: relative; padding:3px 10px; background: #fff; border-radius:0px; border: none;}
.pop_option_tbl td.sdetail::before { position: absolute; width: 3px; height: 3px; border-radius: 50px; content: ""; background: #ddd; left:0px; top:10px; display: block;}
.pop_option_tbl .hide >td {display: flex; padding-left: 20px;}
.pop_option_tbl .stxtList {width:100%; background: #fafafa; margin:5px; padding: 5px 10px; border: 1px solid #ddd; border-radius: 5px;}

/* 팝업타이틀 */
.popTitle { position: relative; border-top: 2px solid #111; padding: 10px 10px; border-bottom: 2px dashed #ddd; background: #fafafa; display: flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
.popStitle { padding: 10px 10px; background: #f5f5dc; text-align: center;}

/* 회원가입 */
.pop_memjoin_tbl ul {display: flex; flex-wrap:wrap; justify-content:space-between; padding: 5px 10px; border-top: 2px solid #111; border-bottom: 1px solid #ddd; padding: 10px 10px; background: #fafafa;}
.pop_memjoin_tbl ul li {width: 48%;}
.pop_memjoin_tbl ul li input {width: 100% !important; border: 1px solid #ddd; border-radius:5px; padding:10px 15px; background: #fff;}
.pop_memjoin_tbl ul li:last-child {width: 100%; margin-top: 5px;}

.tc {text-align: center;}

/* inbox */
.inBox									{width:95%; max-width:1400px; margin:50px auto; padding:30px 50px; border:1px solid #dcdcdc; background:#FFF; border-radius: 50px 0px;}




@media screen and (max-width:500px) {
.inBox									{padding:20px 30px; border:none;}
}
