@charset "UTF-8";
/**
 * @file	: main.css
 * @author	: story
 * @brief	: 기본 css 파일
 **/

.m_bgset {margin-bottom:50px;}
.m_bgset:after,
.m_bgset .inner:after {content:''; display:block; visibility:hidden; clear:both;}
.m_fix {overflow:hidden !important;}

	/*media query*/
@media screen and (max-width:1024px) {
	.m_bgset {margin-bottom:40px;}
}

@media screen and (max-width:920px) {
	.m_bgset {margin-bottom:35px;}
}
@media screen and (max-width:767px) {
	.m_bgset {margin-bottom:30px;}
}

@media screen and (max-width:640px) {
	.m_bgset {margin-bottom:20px;}
}

@media screen and (max-width:480px) {
}

/********************************
 section01
 *******************************/
 /*메인비주얼*/ 
.m_bgset01 {padding-top:50px;}
.m_bgset01 .inner {display:flex; flex-wrap:nowrap; justify-content:space-between;}
.m_bgset01 .inner .mc_box {border-radius:20px;}
.mainVisual_box {overflow:hidden; width:70%; background-color:#ffeeeb; box-shadow:0 0 15px rgba(0,0,0,0.1);}
.mainVisual_box .main_inner {overflow:hidden; position:relative; min-height:460px;}
.mainVisual_box .main_inner:before {content:''; display:block; height:395px; width:660px; position:absolute; top:84px; right:-11rem; background:url(/images/egovframework/story/web/main/img_mainImg.svg) no-repeat;}
.mainVisual_box .main_inner .title_box {position:absolute; top:36%; left:6rem; transform:translateY(-18%);}
.mainVisual_box .main_inner .title_box span {display:block; font-family:'OneMobile';}
.mainVisual_box .main_inner .title_box .tit01 {font-size:4.6rem; color:#e36121; margin-bottom:30px; text-shadow:0 0 20px #ffeeeb;}
.mainVisual_box .main_inner .title_box .tit02 {font-size:2.3rem; color:#222;}

.mainVisual_box .main_inner .account_box {position:absolute; bottom:0; left:0; right:0; border-top-left-radius:5px; border-top-right-radius:5px; border-bottom-left-radius:20px; border-bottom-right-radius:20px; padding:13px; background-color:#e36121;}
.mainVisual_box .main_inner .account_box .account {color:#fff; text-align:center; display:block;}

.quick_box {width:calc(30% - 35px); margin-left:35px;}
.quick_box .qbox {position:relative; display:block; width:100%; border-radius:20px; padding:35px; margin-bottom:15px; text-decoration:none; box-shadow:0 0 15px rgba(0,0,0,0.1); box-sizing:border-box;}
.quick_box .qbox.q01 {background-color:#f3ffe7;}
.quick_box .qbox.q02 {background-color:#fff6e5;}
.quick_box .qbox.q03 {background-color:#ffe9eb; margin-bottom:0px;}
.quick_box .qbox:before {content:''; display:block; position:absolute; right:35px; transition:.3s; background-repeat:no-repeat;}
.quick_box .qbox.q01:before {width:116px; height:116px; bottom:22px; background-image:url(/images/egovframework/story/web/main/img_tab01.svg);}
.quick_box .qbox.q02:before {width:91px; height:87px; bottom:24px; background-image:url(/images/egovframework/story/web/main/img_tab02.svg);}
.quick_box .qbox.q03:before {width:110px; height:86px; bottom:26px; background-image:url(/images/egovframework/story/web/main/img_tab03.svg);}
.quick_box .qbox .q_inbox {display:block; width:100%; text-decoration:none;}
.quick_box .qbox .q_inbox .q_intit {display:block; font-family:'OneMobile'; color:#2d2d2d; font-size:2.4rem; padding-bottom:12px; line-height:1;}
.quick_box .qbox .q_inbox .arrow {position:relative; display:block; width:38px; height:38px; border-radius:50%;}
.quick_box .qbox.q01 .q_inbox .arrow {background-color:#89dc36;}
.quick_box .qbox.q02 .q_inbox .arrow {background-color:#f1b23c;}
.quick_box .qbox.q03 .q_inbox .arrow {background-color:#fd97a0;}
.quick_box .qbox .q_inbox .arrow:before {content:''; display:block; position:absolute; top:50%; left:50%; margin:-7px 0 0 -7px; width:16px; height:14px; background:url(/images/egovframework/story/web/main/arrow_tab.svg) no-repeat;}

.quick_box .qbox:hover:before {bottom:30px;} /*hover 했을때*/
.quick_box .qbox.q01:hover .q_inbox .arrow {background-color:#7cd227;}
.quick_box .qbox.q02:hover .q_inbox .arrow {background-color:#e0a636;}
.quick_box .qbox.q03:hover .q_inbox .arrow {background-color:#eb848d;}

/* media query */
@media screen and (max-width:1520px) {
	.m_bgset01 {padding-left:20px; padding-right:20px;}
}
@media screen and (max-width:1450px) {
	.quick_box .qbox:before {right:20px;}
	.quick_box .qbox.q01:before {bottom:18px; right:15px;}
}
@media screen and (max-width:1200px) {
	.mainVisual_box {width:65%;}
	.mainVisual_box .main_inner {min-height:404px;}
	.mainVisual_box .main_inner:before {height:305px; width:560px; top:84px; right:-16rem;}
	.mainVisual_box .main_inner .title_box {left:4rem;}
	.mainVisual_box .main_inner .title_box .tit01 {font-size:4.0rem; margin-bottom:10px;}
	.mainVisual_box .main_inner .title_box .tit02 {font-size:2.0rem;}

	.quick_box {width:calc(35% - 30px); margin-left:30px;}
	.quick_box .qbox {padding:28px;}
	.quick_box .qbox:before {right:25px;}
	.quick_box .qbox.q01:before {width:100px; height:116px; bottom:6px;}
	.quick_box .qbox.q02:before {width:81px; height:87px; bottom:15px;}
	.quick_box .qbox.q03:before {width:100px; height:86px; bottom:15px;}
	.quick_box .qbox .q_inbox {display:block; width:100%;}
	.quick_box .qbox .q_inbox .q_intit {font-size:2.2rem; padding-bottom:13px;}
	.quick_box .qbox .q_inbox .arrow {width:34px; height:34px;}
}

@media screen and (max-width:1024px) {
}
@media screen and (max-width:920px) {
	.m_bgset01 .inner {flex-wrap:wrap; justify-content:center;}
	.mainVisual_box {width:100%; margin-bottom:30px;}
	.mainVisual_box .main_inner {min-height:404px;}
	.mainVisual_box .main_inner:before {height:305px; width:560px; top:84px; right:-16rem;}
	.mainVisual_box .main_inner .title_box {left:4rem;}
	.mainVisual_box .main_inner .title_box .tit01 {font-size:4.0rem; margin-bottom:10px;}
	.mainVisual_box .main_inner .title_box .tit02 {font-size:2.0rem;}
	
	.quick_box {width:100%; margin-left:0px;}
	.quick_box .qbox.q01:before {bottom:10px; width:96px; height:106px; right:25px;}
	.quick_box .qbox.q02:before {bottom:13px;}
	.quick_box .qbox.q03:before {bottom:15px; width:90px; height:86px;}
}

@media screen and (max-width:767px) {	
	.ctrl_box {bottom:10px; right:10px;}
	.ctrl_box > dl dd {margin-left:2px;}
}

@media screen and (max-width:640px) {
	.mainVisual_box .main_inner {min-height:390px;}
	.mainVisual_box .main_inner:before {height:280px; width:460px; top:auto; bottom:-4rem; left:50%; right:auto; margin-left:-230px;}
	.mainVisual_box .main_inner .title_box {position:static;text-align:center;transform: inherit;padding-top: 39px;}
	.mainVisual_box .main_inner .title_box .tit01 {font-size:3.3rem; margin-bottom:5px;}
	.mainVisual_box .main_inner .title_box .tit02 {font-size:1.8rem;}
	
	.quick_box .qbox:before {right:20px;}
	.quick_box .qbox.q01:before {right:20px;}
}

@media screen and (max-width:480px) {
	.mainVisual_box .main_inner {min-height:350px;}
	.mainVisual_box .main_inner:before {height:250px; width:330px; top:auto; bottom:-4rem; left:50%; right:auto; margin-left:-165px;}
	.mainVisual_box .main_inner .title_box .tit01 {font-size:3.0rem; margin-bottom:5px;}
	.mainVisual_box .main_inner .title_box .tit02 {font-size:1.7rem;}
}




/********************************
 section02
 *******************************/
.m_bgset02 {padding:10px 0 50px;}
.m_bgset.m_bgset02 {margin-bottom:0;}
.m_bgset02 .inner {display:flex; flex-wrap:nowrap; justify-content:space-between;}
 
/*공지사항*/
/* 알림존 */
.notice_box {position:relative; width:70%;}
.notice_box .bigtit {color:#242d36; font-size:3.2rem; font-family:'OneMobile';}
.notice_list {position:relative; margin:12px 0 0;}
.notice_list:after {content:''; display:block; visibility:hidden; clear:both;}
.notice_list .tit {display:block; position:absolute; top:-80px; width:13%; font-size:2.0rem; color:#222; font-weight:500; text-align:center; z-index:5;}
.notice_list .tit.tit01 {right:23%;}
.notice_list .tit.tit02 {width:16%; right:6%;}

.notice_list .tit span {position:relative; display:inline-block; padding:8px 0; border:1px solid #d2d2d2; color:#5c5c5d; background-color:#fff; border-radius:50px; width:100%;}

.notice_list .tit:hover span,
.notice_list .tit:active span,
.notice_list .tit:focus span{border:1px solid #f16825; color:#f16825;}
.notice_list .tit.on span {position:relative; border:1px solid #f16825; background-color:#f16825; color:#fff; font-weight:600; text-decoration:none;}

.notice_list .btn_more {display:inline-block; position:absolute; right:0; top:-80px; width:44px; height:44px; border-radius:16px; background-color:#5b504e;}
.notice_list .btn_more:before {content:''; position:absolute; right:50%; top:50%; margin-top:-6px; margin-right:-6px; width:12px; height:12px; background:url(/images/egovframework/story/web/main/more_btn.svg) no-repeat;}

.notice_list .list_box {display:none; position:relative; margin-top:45px; z-index:1;}
.notice_list .list_box ul {display:flex; flex-wrap:nowrap; justify-content:flex-start; gap:20px;}
.notice_list .list_box ul li {position:relative; width:33.3333%;}
.notice_list .list_box ul li a {overflow:hidden; display:block; padding:40px; border:2px solid #dee1e2; background-color:#fff; border-radius:30px; color:#333;}
.notice_list .list_box ul li a .fir_tit {overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.3; font-size:2.2rem; font-weight:600; color:#262626; height:55px; margin-bottom:15px;}
.notice_list .list_box ul li a .fir_content {overflow:hidden; min-height:56px; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.4; color:#444;}
.notice_list .list_box ul li a .date {display:block; padding-top:35px; font-size:1.8rem; color:#767676;}
.notice_list .list_box ul li a .fileY {display:inline-block; font-size:0; text-indent:-9999px; position:absolute; bottom:40px; right:40px; width:25px; height:24px; background:url(/images/egovframework/story/uljusports/main/main_ir.png) -41px -41px no-repeat;}
.notice_list .list_box ul li.nopost {display:flex; align-items:center; justify-content:center; width:100%; min-height:277px; background-color:#fff; border:2px dashed #ddd; border-radius:30px; color:#565656;}

.notice_list .list_box ul li a:hover {text-decoration:none; border:2px solid #cacccd; box-shadow:0 0 10px rgba(0,0,0,0.05);}

.mpopup_box {width:calc(30% - 35px); margin-left:35px;}
.mpopup_box .mbs_inbox {border-radius:20px; background-color:#ccc;}
.mpopup_box .mpop_listbox {position:relative; min-height:365px; z-index:5;}
.mpopup_box .mpop_listbox img {width:100%; height:365px; border-radius:20px;}
.mpopup_box .mpop_listbox .main_alimi {overflow:hidden; position:relative; display:block;}
.mpopup_box .mpop_listbox .main_alimi:after {content:''; display:block; visibility:hidden; clear:both;}
.mpopup_box .mpop_listbox .main_alimi li {display:block;}

.ctrl_box {position:absolute; right:15px; bottom:15px; background-color:#fff; border-radius:50px; box-shadow:1px 3px 5px rgba(0,0,0,0.2); z-index:30;}
.ctrl_box > dl {display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:center; padding:0 10px 0 0;}
.ctrl_box > dl dd {position:relative; display:inline-block; color:#fff;}
.ctrl_box > dl dd .ctrl_cont,
.ctrl_box > dl dd a {position:relative; display:block; width:40px; height:40px; box-sizing:border-box;}
.ctrl_box > dl dd a:before {content:''; position:absolute; left:50%; top:50%; margin:-20px 0 0 -20px; width:40px; height:40px; background-image:url(/images/egovframework/story/web/main/pager_ir.png); background-repeat:no-repeat;}
.ctrl_box > dl dd a.ctrl_prev:before {background-position:0px 0px;}
.ctrl_box > dl dd a.ctrl_stop:before {background-position:-80px 0;}
.ctrl_box > dl dd a.ctrl_play:before {background-position:-120px 0;}
.ctrl_box > dl dd a.ctrl_next:before {background-position:-40px 0;}
.ctrl_box > dl dd span.ctrl_cont {padding:5px 12px 5px 22px; width:auto; height:auto; color:#555; font-size:1.7rem;}
.ctrl_box > dl dd span.ctrl_cont strong {font-weight:600; color:#f75630; font-size:2.0rem;}

	/*media query*/
@media screen and (max-width:1520px) {
	.m_bgset02 {padding-left:20px; padding-right:20px;}
}
@media screen and (max-width:1200px) {
	.notice_box {width:65%;}
	.notice_box .bigtit {font-size:3.0rem;}
	.notice_list {position:relative; margin:12px 0 0;}
	.notice_list .list_box ul li {position:relative; width:33.3333%;}
	.notice_list .list_box ul li a {padding:30px;}
	.notice_list .list_box ul li a .fir_tit {text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.3; font-size:2.2rem; height:55px;}
	.notice_list .list_box ul li a .fir_content {min-height:80px; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; font-size:1.9rem;}
	.notice_list .list_box ul li a .date {padding-top:30px;}	
	.notice_list .tit {width:15%; font-size:1.8rem;}
	.notice_list .tit.tit01 {right:28%;}
	.notice_list .tit.tit02 {width:19%; right:8%;}

	.mpopup_box {width:calc(35% - 30px); margin-left:30px;}
}

@media screen and (max-width:1024px) {
	.notice_list .list_box ul li {width:50%;}
	.notice_list .list_box ul li:nth-child(3) {display:none;}
}

@media screen and (max-width:920px) {	
	.m_bgset02 .inner {display:flex; flex-wrap:wrap; justify-content:center;}
	
    .notice_box {width:100%; margin-bottom:30px;}
	.notice_list .list_box {margin-top:20px;}
	.notice_list .list_box ul li {width:33.3333%;}
	.notice_list .list_box ul li:nth-child(3) {display:block;}
	.notice_list .list_box ul li.nopost {min-height:15rem;}
	.notice_list .tit {display:block; position:absolute; top:-70px;}
	.notice_list .btn_more {top:-70px;}
	
	.mpopup_box {width:100%; min-height:auto; margin-left:0px;}
	.mpopup_box .mpop_listbox {min-height:auto;}
	.mpopup_box .mpop_listbox img {width:100%; height:auto;}
}

@media screen and (max-width:767px) {	
	.notice_box .bigtit {font-size:2.4rem;}
	.notice_list .tit.tit01 {width:20%; right:36%;}
	.notice_list .tit.tit02 {width:24%; right:10%;}
	.notice_list .list_box ul {flex-wrap:wrap; gap:10px;}
	.notice_list .list_box ul li {width:100%;}
	.notice_list .list_box ul li a {padding:25px;}
	.notice_list .list_box ul li a .fir_tit {font-size:1.9rem; height:auto;}
	.notice_list .list_box ul li a .fir_content {min-height:auto;-webkit-line-clamp:2; font-size:1.7rem;}
	.notice_list .list_box ul li a .date {padding-top:15px; font-size:1.6rem;}
}

@media screen and (max-width:640px) {
}

@media screen and (max-width:480px) {
	.notice_list .list_box {margin-top:70px;}
	.notice_list .tit {display:block; position:absolute; top:-60px;}
	.notice_list .tit.tit01 {width:30%; right:auto; left:0;}
	.notice_list .tit.tit02 {width:38%; right:auto; left:33%;}
	.notice_list .btn_more {top:-60px;}
}







/*팝업*/
.popup_layer {position:absolute; left:10px; top:10px; box-shadow:1px 1px 5px 0 rgba(0,0,0,0.7); z-index:550;}
.popup_img {}
.popup_close {height:25px; background-color:#000; text-align:right; color:#fff;}
.btn_close {padding-top:7px; padding-right:10px;}
.btn_close img {display:block; float:right;}


@media screen and (max-width:640px) {
.popup_layer {top:10px !important; left:20px !important;}
}
@media screen and (max-width:480px) {
.popup_layer {left:15px !important; right:15px !important;}
.popup_img img {width:100% !important;}
}