@charset "utf-8";


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
  
    프로그램 리스트
    연관단어 : .pro_list

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.pro_list ul li,
.pro_list ul li p{transition:all 0.2s ease; -webkit-transition:all 0.2s ease;}
.pro_list p+p{margin-top:auto;}

.pro_list{margin-top:1.5em; border-top:2px solid #46644C; border-bottom:1px solid #555;}
.pro_list ul{display:table; table-layout:fixed; width:100%; border-collapse:collapse; border-spacing:0;}
.pro_list ul li{position:relative; display:table-row; border-bottom:1px solid #F7F7F7;}
.pro_list ul li:last-child{border-bottom:0;}
.pro_list ul li p,
.pro_list ul li .subject,
.pro_list ul li.thead strong{display:table-cell; text-align:center; vertical-align:middle;}
.pro_list ul li p{height:2.3em; padding:0.6em 0.5em; font-size:1em;}

.pro_list ul li .no{width:4em; font-weight:500; color:#46644C;}
.pro_list ul li .subject{width:auto;}
.pro_list ul li .writer{width:6em; word-break:break-all;}
.pro_list ul li .date{width:7em;}
/*헤드 항목*/
.pro_list ul li.thead{background-color:#EBEBE0;}
.pro_list ul li.thead strong{height:3.2em; line-height:1.3em; padding:0.6em 0.5em; font-weight:400; font-size:1.15em; color:#222E3C;}

/*제목부분*/
.pro_list ul li .subject a{display:block; line-height:1.4em;}
.pro_list ul li .subject a strong{display:inline-block; font-weight:400;}
.pro_list ul li .subject a:hover strong{text-decoration:underline;}
.pro_list ul li.no_data{position: relative; height: 5em;}
.pro_list ul li.no_data > div{
	position: absolute; left: 50%; line-height: 5; white-space: nowrap; 
	transform : translateX(-50%); -webkit-transform : translateX(-50%);
}

@media screen and (max-width:840px){
  .pro_list ul,
  .pro_list ul li{display:block;}
  .pro_list ul li{padding:1em 1.2em;}
  .pro_list ul li.thead{display:none;}
  .pro_list ul li p{height:auto;}
  .pro_list ul li p:after{content:""; display:inline-block; width:1px; height:0.8em; margin:0 0.5em 0 0.7em; background-color:#c7c7c7; vertical-align:middle;}
  .pro_list ul li p:last-child:after{display:none;}
  .pro_list ul li .subject{text-align: left;}
  .pro_list ul li .subject:after,
  .pro_list ul li .no:after{display:none;}
  .pro_list ul li .no{width:40px; height:18px; line-height:18px; padding:0; background:#e2e1e1; border-radius:5px; -webkit-border-radius:5px; font-size:0.9em;}
  .pro_list ul li .writer,
  .pro_list ul li .date{display: inline-block; width:auto; padding:0; font-size:0.9em;}
  /*제목부분*/
  .pro_list ul li .subject{display:inline-block; width:100%; padding:0.6em 0 0; box-sizing:border-box;}
  .pro_list ul li .subject a strong{overflow:hidden; position:relative; width:auto; max-width:100%; min-height:18px; white-space:nowrap; text-overflow:ellipsis; box-sizing:border-box;}
}



/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
  
    프로그램 게시판 등록
	연관단어 : .pro_insert

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.pro_insert .detail > li,
.pro_insert .detail > li .titles{transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}

.pro_insert{display:block; padding:0; border-top:2px solid #333; border-bottom:1px solid #46644C;}
/*항목리스트*/
.pro_insert .detail{background:#fff;}
.pro_insert .detail > li{position:relative; width:100%; min-height:3.5em; padding-left:8.8em; border-bottom:1px solid #F7F7F7; box-sizing:border-box;}
.pro_insert .detail > li:last-child{border-bottom:0;}
.pro_insert .detail > li .titles{position:absolute; top:0; left:0; width:7.955em; height:100%; background:#EBEBE0; font-size:1.1em;}
.pro_insert .detail > li .titles span{display:table; width:100%; height:100%;}
.pro_insert .detail > li .titles strong{display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle; font-weight:400; font-size: 1.08em;}
.pro_insert .detail > li .txts{padding:0.5625em 0.625em;}
/*안에 인풋 요소들*/
.pro_insert .detail > li .txts input[type="text"]{width:100%; height:2.8125em; padding: 0 0.5em; background-color: #F7F7F7; border: none; font-size: 1em; line-height: 1.5;}
.pro_insert .detail > li .txts textarea{width:100%; height:18.125em; padding: 0.5em; background-color: #F7F7F7; border: none; font-size: 1em;}
.pro_insert .detail > li .txts select{height:2.1875em; font-size: 1em;}
.pro_insert .detail > li .txts input[type="file"]{font-size: 1em;}

@media screen and (max-width:840px){
  .pro_insert .detail > li{padding-left:90px;}
  .pro_insert .detail > li .titles{width:90px;}
}
@media screen and (max-width:640px){
  .pro_insert .detail > li{min-height:2.72em;}
  .pro_insert .detail > li .txts{padding:10px 10px;}
  .pro_insert .detail > li .txts:after{content: ""; display: block; clear: both;}
  /*안에 인풋 요소들*/
  .pro_insert .detail > li .txts input[type="text"]{height:2.15em;}
  .pro_insert .detail > li .txts select{float: left; width: 49.5%; min-width: auto; height:2.15em;}
  .pro_insert .detail > li .txts select:nth-child(2n+2){margin-left: 1%;}
  .pro_insert .detail > li .txts textarea{height:10.72em;}
}
@media screen and (max-width:420px){
  /*안에 인풋 요소들*/
  .pro_insert .detail > li .txts select{float: none; width: 100%;}
  .pro_insert .detail > li .txts select:nth-child(2n+2){margin-left: 0;}
  .pro_insert .detail > li .txts select:nth-child(n+2){margin-top: 0.25em;}
}



/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
  
    프로그램 게시판 상세
	연관단어 : .pro_view

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.pro_view .subject,
.pro_view .detail li,
.pro_view .detail > li .titles{transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.pro_view{display:block; padding:0; border-top:2px solid #333; border-bottom:1px solid #46644C;}
/*제목*/
.pro_view .subject{display: block; width:100%; height:auto; line-height:1.4em; padding:1.3em 2em; background:#FBFBFB; font-size:1.6em; font-weight:500; box-sizing:border-box;}
/*항목리스트*/
.pro_view .detail{overflow:hidden; background:#fff;}
.pro_view .detail > li{float:left; position:relative; width:100%; min-height:3.5em; padding-left:8.8em; border-top:1px solid #F7F7F7; box-sizing:border-box;}
.pro_view .detail > li:first-child{border-top: none;}
.pro_view .detail > li .titles{position:absolute; top:0; left:0; width:7.955em; height:100%; background:#EBEBE0; font-size:1.1em;}
.pro_view .detail > li .titles span{display:table; width:100%; height:100%;}
.pro_view .detail > li .titles strong{display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle; font-weight:400; font-size: 1.08em;}
.pro_view .detail > li .txts{padding:0.95em 0.8em;}
/*내용*/
.pro_view .detail > li.no_title{padding-left:0;}
.pro_view .detail > li .contents{min-height:15em; padding:0.95em 0.8em;}
.pro_view .detail > li .contents>img{display: block; max-width:70%; margin:0 auto 1.5em;}
.pro_view .detail > li.no_title .contents{padding:1.5em 1.2em;}

@media screen and (max-width:640px){
  .pro_view .subject{padding:1em 1.5em; font-size:1.4em;}
  /* .pro_view .detail > li .contents{min-height: 10em;} */
}
@media screen and (max-width:480px){
  .pro_view .detail > li{padding-left:6em;}
  .pro_view .detail > li .titles{width:5.5em;}
}



/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 홍보 > 카드뉴스
	연관단어 : #pro_card

////////////////////////////////////////////////////////////////////////////// */
#pro_card .card_news {position:relative; padding:3.125em 4.6em 5.125em; background-color:#F7F7F7;}
#pro_card .card_news .head {position:relative; z-index:2; max-width:66.5625em; padding:0px; margin:0 auto; text-align: center;}
#pro_card .card_news .head img {width:100%; max-width: 40.625em; display:inline-block;}
#pro_card .card_news .head .btn_left,
#pro_card .card_news .head .btn_right {
    overflow:hidden; display:block; position:absolute; top: 50%; width:2.75em; height:4.875em; text-indent:-1000px; background-image:url(../../../images/site/eng/content/card_news_arrow.svg); background-repeat:no-repeat; background-position:center center; background-size: contain;
    transition: width 0.2s ease, height 0.2s ease; -webkit-transition: width 0.2s ease, height 0.2s ease;
    transform: translateY(-50%); -webkit-transform: translateY(-50%);
}
#pro_card .card_news .head .btn_left {left:0;}
#pro_card .card_news .head .btn_right {right:0; background-image:url(../../../images/site/eng/content/card_news_arrowr.svg);}
#pro_card .card_news .midd {position:relative; z-index:5; max-width:66.5625em; margin:0 auto;}
#pro_card .card_news .midd:after{content: ""; display: block; clear: both;}
#pro_card .card_news .midd .count {margin:0.5em auto; text-align:right; color:#222E3C;}
#pro_card .card_news .midd ul {overflow:hidden; left:0 !important; width:100%;}
#pro_card .card_news .midd ul:after{content: ""; display: block; clear: both;}
#pro_card .card_news .midd ul li {float: left; display: inline-block; margin: 0 0.9375em 0.9375em 0;}
#pro_card .card_news .midd ul li:last-child{margin-right: 0;}
#pro_card .card_news .midd ul li a {overflow:hidden; display:block; position:relative; width:7.5em; height:7.5em;}
#pro_card .card_news .midd ul li a img {
	position: absolute; top: 0; left: 50%; height:100%; display:block;
	transform: translateX(-50%); -webkit-transform: translateX(-50%);
}
#pro_card .card_news .midd ul li a:before {opacity:0.5; -webkit-opacity:0.5; content:""; display:block; position:absolute; left:0; top:0; z-index: 1; width:100%; height:100%; background-color:#000; transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}
#pro_card .card_news .midd ul li.on a:before {opacity:0; -webkit-opacity:0;}
#pro_card .card_news .bott {max-width:66.5625em; margin:0 auto;}
#pro_card .card_news .bott .text {}
#pro_card .card_news .bott .text h5 {margin:0.2em 0 0.6em 0; font-size: 1.75em; line-height: 1.6; color: #222E3C; font-weight: 400;}
#pro_card .card_news .bott .text .scroll {height:8.67em; padding:1.66em 0.89em; background:#fff; border:1px solid #C4C4C4; overflow:auto; line-height: 1.75; font-size: 1.125em; color: #222E3C; letter-spacing: -0.05em; box-sizing: border-box;}

#pro_card .board_search{margin-top: 3.5em;}

#pro_card .card_list {padding:1.5em 0 0 0; border-top:1px solid #C4C4C4; box-sizing: border-box;}
#pro_card .card_list:after {content:""; display:block; clear:both;}
#pro_card .card_list li {float:left; width:23.5%; margin-right:2%; margin-bottom:2%;}
#pro_card .card_list li:nth-child(4n) {margin-right:0;}
#pro_card .card_list li a {display:block; overflow:hidden; border:1px solid #d0d0d0; position:relative; text-decoration: none;}
#pro_card .card_list li a .img_wrap{position: relative; display: block; width: 100%; height: 14em; background-color: #eee;}
#pro_card .card_list li a .img_wrap:before{
    content: ""; position: absolute; top: 0; left: 0; z-index: 2; opacity: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5);
    transition: all 0.2s ease; -webkit-transition: all 0.2s ease;
}
#pro_card .card_list li a .img_wrap:after{
    content:""; position:absolute; top:50%; left:50%; z-index:3; opacity: 0; display: block; width:4.375em; height:4.375em; background: rgba(255,255,255,0.4) url(../../../images/site/skin/board_icon_plus.svg) no-repeat center center;background-size:100% auto;
    border-radius:50%; -webkit-border-radius:50%;
    transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); 
    transition: all 0.2s ease; -webkit-transition: all 0.2s ease;
 }
#pro_card .card_list li a:hover .img_wrap:before,
#pro_card .card_list li a:focus .img_wrap:before,
#pro_card .card_list li a:active .img_wrap:before,
#pro_card .card_list li a:hover .img_wrap:after,
#pro_card .card_list li a:focus .img_wrap:after,
#pro_card .card_list li a:active .img_wrap:after{opacity: 1;}
#pro_card .card_list li a .img_wrap img {
    position: absolute; top: 0; left: 50%; display: block; height: 100%; 
    transform: translateX(-50%); -webkit-transform: translateX(-50%);
}
#pro_card .card_list li a .title {display: block; margin: 5% 5% 0; color: #222E3C; font-size: 1.1875em; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
#pro_card .card_list li a .date {display: block;  margin: 0.2em 5% 7%; color: #666; font-size: 0.9375em; letter-spacing: -0.04em;}
@media screen and (max-width:1280px){
    #pro_card .card_news .midd .btn_left {left:-3.2em;}
    #pro_card .card_news .midd .btn_right {right:-3.2em;}
    #pro_card .card_list li a .img_wrap:after{width: 3.28125em; height: 3.28125em;}
}
@media screen and (max-width:1024px){
    #pro_card .card_news{padding: 3em 3.5em 4.5em;}
    #pro_card .card_news .head .btn_left,
    #pro_card .card_news .head .btn_right{background-size: 80%;}
    #pro_card .card_news .midd ul{padding: 0 0; box-sizing: border-box;}
    #pro_card .card_news .midd ul li{margin: 0 0.75em 0.75em 0;}
    #pro_card .card_news .midd ul li a {width: 6.2em; height: 6.2em;}
    #pro_card .card_news .midd .btn_left,
    #pro_card .card_news .midd .btn_right {top:calc(50% + 0.75em);}
    #pro_card .card_news .midd .btn_left{left: -2.5em;}
    #pro_card .card_news .midd .btn_right{right: -2.5em;}
    #pro_card .card_news .bott .text h5{font-size: 1.5em;}
    #pro_card .card_news .bott .text .scroll{font-size: 1.07em;}
    #pro_card .board_search{margin-top: 2em;}
    #pro_card .card_list li a .img_wrap:after{width: 2.854em; height: 2.854em;}
    #pro_card .card_list li a .title{font-size: 1.05em;}
    #pro_card .card_list li a .date{font-size: 0.9em;}
    #pro_card .card_list li{width: 32%;}
    #pro_card .card_list li:nth-child(4n){margin-right: 2%;}
    #pro_card .card_list li:nth-child(3n){margin-right: 0;}
}
@media screen and (max-width:880px){
    #pro_card .card_news .head .btn_left, 
    #pro_card .card_news .head .btn_right{width: 1.65em; height: 2.925em; background-size: contain;}
    #pro_card .card_news .head .btn_left{left: -1.8em;}
    #pro_card .card_news .head .btn_right{right: -1.8em;}
}
@media screen and (max-width:800px){
    #pro_card .card_news .head .btn_left{left: -2.6em;}
    #pro_card .card_news .head .btn_right{right: -2.6em;}
}
@media screen and (max-width:640px){
    #pro_card .card_news {padding:2.5em 3em 3.5em;}
    #pro_card .card_news .head .btn_left,
    #pro_card .card_news .head .btn_right{width: 1.375em; height: 2.4375em;}
    #pro_card .card_news .head .btn_left{left: -2.2em;}
    #pro_card .card_news .head .btn_right{right: -2.2em;}
    #pro_card .card_news .midd ul li {margin: 0 0.5em 0.5em 0;}
    #pro_card .card_news .midd ul li a {width: 5em; height: 5em;}
    #pro_card .card_news .bott .text .scroll {padding:1em; height:8.58em;}
    #pro_card .card_list li a .img_wrap:after{width: 2.86em; height: 2.86em;}
    #pro_card .card_list li{width: 49%;}
    #pro_card .card_list li:nth-child(3n){margin-right: 2%;}
    #pro_card .card_list li:nth-child(2n){margin-right: 0;}
}
@media screen and (max-width:480px){
    #pro_card .card_news {padding:2em 2.5em 3em;}
    #pro_card .card_news .head .btn_left {left: -2em;}
    #pro_card .card_news .head .btn_right {right: -2em;}
    #pro_card .card_news .midd ul li {margin: 0 0.3em 0.3em 0;}
    #pro_card .card_news .midd ul li a {width: 4.2em; height: 4.2em;}
    #pro_card .card_news .bott .text .scroll {padding:1em; height:8.58em;}
    #pro_card .card_news .head .btn_left,
    #pro_card .card_news .head .btn_right{width: 1.1em; height: 1.95em;}
    #pro_card .card_news .head .btn_left{left: -1.8em;}
    #pro_card .card_news .head .btn_right{right: -1.8em;}
}
@media screen and (max-width:400px){
    #pro_card .card_list li{width: 100%;}
    #pro_card .card_list li:nth-child(3n){margin-right: 0;}
    #pro_card .card_list li:nth-child(2n){margin-right: 0;}
	
}

/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 알림/소식 > 연간일정
	연관단어 : #not_cale

////////////////////////////////////////////////////////////////////////////// */
#not_cale{border-top: none !important; padding-top: 0 !important;}
#not_cale .tab_wrap .tab_cont{background-color: #fff; padding: 1.5em 0;}
#not_cale .tab_wrap .tab_cont#tab01 .titles{display: block; margin-bottom: 0.6em; text-align: center; font-size: 2.5em; font-family: 'Rubik'; line-height: 1;}
#not_cale .tab_wrap .tab_cont#tab02 .titles{display: block; margin-top: 1.25em; margin-bottom: 0.4em; font-size: 1.875em; font-family: 'Roboto'; line-height: 1; font-weight: 700;}
#not_cale .tab_wrap .tab_cont#tab02 .titles:first-child{margin-top: 0;}
#not_cale .tab_wrap .tab_cont .cal_wrap{position: relative;}
#not_cale .tab_wrap .tab_cont .cal_wrap:after{content: ""; display: block; clear: both;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar,
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text{float: left;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar{width: 22.875em; overflow: hidden;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol{position: relative; width:100%; border: 1px solid; box-sizing: border-box; border-top: none;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_head{background-color: #222E3C; border-color: #222E3C;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body {border-color: rgba(70, 100, 76, 0.2);}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol:after{content: ""; display: block; clear: both;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li{position: relative;float: left;display: table;table-layout: fixed;width: 14.288%;height: 3.86em;font-size: 0.875em;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li:before{content: ""; position: absolute; top: 0; right: 0; display: block; width: 1px; height: 100%; background-color: #dae0db;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li:nth-child(7n+7):before{display: none;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_head li{}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_head li span{display: table-cell; width: 100%; vertical-align: middle; text-align: center; font-weight: 300; color: #fff;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_head li:first-child span{color: #E15757; font-weight: 400;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_head li:last-child span{color: #5f9be0; font-weight: 400;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_head li:before{background-color: rgba(255, 255, 255, 0.2);}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li{padding: 0.5em; box-sizing: border-box;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li:after{content: ""; position: absolute; bottom: 0; left: 0; display: none; width: 130%; height: 1px; background-color: #dae0db;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li:nth-last-child(n+8):after{display: block;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li span,
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li a{position: relative; display: block; width: 100%; height: 100%; line-height: 1; font-size: 0.875em; color: #222E3C; letter-spacing: 0;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li.today{color: #46644C;}
#not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li.plan{background: url(../../../images/site/eng/content/not_cale_img03.svg) no-repeat right 0.4em bottom 0.5em; background-size: 10px 10px;}

/*일정텍스트*/
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text{width: calc(100% - 22.875em - 1.875em); margin-left: 1.875em; box-sizing: border-box;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text:after{content: ""; display: block; clear: both;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li{display: table; table-layout: fixed; width: 100%; padding: 1.4em 0; border-top: 1px solid rgba(196, 196, 196, 0.56); box-sizing: border-box;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li:first-child{border-color: #222E3C;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li:last-child{border-bottom: 1px solid #222E3C;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > div{display: table-cell;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates{width: 3.9375em; height: 3.9375em; vertical-align: top;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates.during{width: 9.75em;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates b{display: inline-block; font-size: 1.6875em; width: 2.3334em; height: 2.3334em; line-height: 2.33; background-color: #F7F7F7; color: #46644C; text-align: center; font-weight: 700;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates span{display: inline-block; vertical-align: super; width: 1.5em; font-weight: 700; text-align:center;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .texts{padding: 0 0 0 1.5em; vertical-align: middle; box-sizing: border-box;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .texts strong{font-weight: 500;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .texts p{font-size: 0.9375em;}

/*일정 X*/
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan{position: relative; height: 20.375em; border: 1px solid #BFBFBF;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan div{
    position: absolute; top: 50%; left: 50%; width: 100%; padding: 0 1em; text-align: center; box-sizing: border-box;
    transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan div:before{content: ""; display: inline-block; width: 7.0625em; height: 6.9375em; margin-bottom: 0.8em; background: url(../../../images/site/eng/content/not_cale_img01.svg) no-repeat center center; background-size: contain;}
#not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan div strong{display: block; font-size: 1.25em; font-weight: 500;}

@media screen and (max-width:1024px){
    #not_cale .tab_wrap .tab_cont#tab01 .titles{font-size: 2.4em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar{position: relative; top: auto; left: auto; width: 100%;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li{height: 4em; font-size: 1em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text{width: 100%; margin-left: 0; margin-top: 1.2em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates span{width: 1.4em;}
    
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan{height: auto;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan div{
        position: relative; top: auto; left: auto; padding: 2em 1em; font-size: 0.95em;
        transform: translate(0,0); -webkit-transform: translate(0,0);
    }
}
@media screen and (max-width:640px){
    #not_cale .tab_wrap .tab_cont#tab01 .titles{font-size: 2.2em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li{height: 3.5em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li.plan{background-size: 8px 8px;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates{font-size: 0.85em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .texts{padding: 0 0 0 1em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li.no_plan div:before{font-size: 0.9em;}
}
@media screen and (max-width:480px){
    #not_cale .tab_wrap .tab_cont#tab01 .titles{font-size: 2em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li{height: 3.5em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li span, 
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li span, 
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li a{font-size: 1em;}
    
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li{display: block; table-layout: auto; padding: 1.2em 0;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > div{display: block; }
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates{font-size: 0.8em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .dates b{font-size: 1.5em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .cal_text li > .texts{padding: 0 0 0 0;}
}
@media screen and (max-width:420px){
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol li{height: 3em; font-size: 0.95em;}
    #not_cale .tab_wrap .tab_cont .cal_wrap .calendar ol.t_body li.plan{background-position: right 0.4em bottom 0.4em; background-size: 7px 7px;}
}


/* //////////////////////////////////////////////////////////////////////////////

    메뉴구조 : 사이버추모관 > 온라인추모
    연관단어 : .memorial

////////////////////////////////////////////////////////////////////////////// */
.memorial .bx1 .txts>[data-skin="btn"],
.memorial .bx1 .imgs
{transition:all 0.2s ease; -webkit-transition:all 0.2s ease;}
.memorial{}
/*추모하기*/
.memorial .bx1,
.memorial .bx2{margin-bottom:2.8em;}
.memorial .bx1{overflow:hidden; display:table; position:relative; width:100%; height:27em; padding:2.5em 6% 2.5em 38.6em; background:url(../../../images/site/eng/content/memorial_bx1_bg.jpg) no-repeat 0 0; background-size:cover; box-sizing:border-box;}
.memorial .bx1 .imgs{position:absolute; bottom:0; left:0; z-index:0; width:36.5em; height:100%;}
.memorial .bx1 .imgs:before{content:""; position:absolute; bottom:0; left:0; z-index:0; width:100%; height:100%; background:url(../../../images/site/eng/content/memorial_bx1_img1.svg) no-repeat left bottom; background-size:100% auto;}
.memorial .bx1 .imgs:after{content:""; position:absolute; bottom:0; left:0; z-index:2; width:100%; height:100%; background:url(../../../images/site/eng/content/memorial_bx1_img2.svg) no-repeat left bottom; background-size:100% auto;}
.memorial .bx1 .imgs>span{opacity:0; overflow:hidden; position:absolute; bottom:6em; left:4.5em; z-index:1; width:25.2em; height:20.6em; background:url(../../../images/site/eng/content/memorial_bx1_img3.svg) no-repeat 0 0; background-size:100% auto; text-indent:-2000px;}
.memorial .bx1 .txts{position:relative; z-index:1; display:table-cell; width:100%; height:100%; vertical-align:middle;}
.memorial .bx1 .txts>strong{display:block; margin-bottom:0.2em; line-height:1.5em; /* font-family:'Nanum Myeongjo'; */ font-weight: 400; letter-spacing:-1px; font-size:2.1em; color:#fff;}
.memorial .bx1 .txts>p{margin-bottom:1.7em; font-size:1.15em; font-weight:300; color:#fff;}
.memorial .bx1 .txts>[data-skin="btn"]{background-color:transparent; border:1px solid #fff; text-decoration:none;}
.memorial .bx1 .txts>[data-skin="btn"]:hover{background-color:rgba(255,255,255,0.7); border-color:transparent; color:#3e2500;}

/*추모 애니메이션*/
.memorial .bx1.on .imgs>span{
    opacity:1; bottom:-0.5em;
    animation-name:letter_Ani;
    animation-duration:1.5s;
}
@keyframes letter_Ani{
    0%{opacity:0; bottom:6em;}
    35%{opacity:0.9; bottom:3em; left:10em; transform:rotateX(-20deg) rotateY(20deg);}
    100%{opacity:1; bottom:-0.5em; left:4.5em; transform:rotateX(0deg) rotateY(0deg);}
}

/*추모글남기기*/
.memorial .bx2{position:relative; padding:2.8em 13em 2.8em 3em; background-color:#EBEBE0; box-sizing:border-box;}
.memorial .bx2 strong{display:block; margin-bottom:0.5em; font-size:1.6em; /* font-family:'Nanum Myeongjo'; */ font-weight: 500; color:#2D4D41;}
.memorial .bx2 [data-skin="btn"]{position:absolute; top:calc(50% - 1.2em); right:3em;}

@media screen and (max-width: 1200px){
    .memorial .bx1{font-size:0.85em;}
}
@media screen and (max-width: 1024px){
    .memorial .bx2{ padding:2.8em 3em;}
    .memorial .bx2 [data-skin="btn"]{position:relative; top:auto; right:auto; margin-top: 0.8em;}
}
@media screen and (max-width: 920px){
    .memorial .bx1{height:23em; padding:2.5em 6% 2.5em 32em;}
    .memorial .bx1 .imgs{font-size:0.85em;}
    .memorial .bx1 .txts>strong{font-size:1.9em;}
}
@media screen and (max-width: 740px){
    .memorial .bx1{height:21em; padding:2.5em 6% 2.5em 23em;}
    .memorial .bx1 .imgs{font-size:0.6em;}
    .memorial .bx1 .txts>strong{font-size:1.9em;}
}
@media screen and (max-width: 640px){
    .memorial .bx1{height:auto; padding:2.5em 3em 7.5em;}
    .memorial .bx1 .txts{text-align:right;}

    .memorial .bx2{padding:2em 6%;}
}
@media screen and (max-width: 480px){
    .memorial .bx1 .txts>strong{font-size:1.7em;}
}



/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 사이버추모관 > 기억의 터(위폐관), 유해봉환 자료 검색 공통
	연관단어 : #cyb_memocyb_2dep

////////////////////////////////////////////////////////////////////////////// */
#cyb_2dep{
    transition: font-size 0.2s ease; -webkit-transition: font-size 0.2s ease;
}
#cyb_2dep .vr_box{position: relative; box-sizing: border-box;}
#cyb_2dep .vr_box:before{
    content: ""; position: absolute; top: 0; left: 0; display: block; width: 43.3125em; height: 100%;  background: url(../../../images/site/eng/content/cyb_memo_img01.png) no-repeat left center; background-size: contain; box-sizing: border-box;
    transition: width 0.2s ease; -webkit-transition: width 0.2s ease;
}
#cyb_2dep .vr_box .txt_box{
    width: 100%; padding: 3.5625em 1em 3.5625em 43.3125em; box-sizing: border-box;
    transition: padding 0.2s ease,font-size 0.2s ease; -webkit-transition: padding 0.2s ease, font-size 0.2s ease;
}
#cyb_2dep .vr_box .txt_box strong{position: relative; z-index: 1; display: block; padding-top: 3em; color: #222E3C; font-size: 2.1875em; font-weight:500;/*  font-family: 'Nanum Myeongjo'; */ letter-spacing: -0.05em; box-sizing: border-box;}
#cyb_2dep .vr_box .txt_box strong:before{
    content: 'MEMORY'; position: absolute; bottom: 0; left: 0; z-index: -1; color: rgba(225, 210, 189, 0.2); font-family: 'Rubik'; font-size: 4.86em; line-height: 1; font-weight: 500; letter-spacing: -0.05em; text-indent: -0.05em; text-transform: uppercase;
    transition: font-size 0.2s ease; -webkit-transition: font-size 0.2s ease;
}
#cyb_2dep .vr_box .txt_box p{width: 100%; max-width: 28em;  margin-top: 0.64em; font-size: 1.1875em; line-height: 1.7; color: #222E3C; letter-spacing: -0.05em;}
#cyb_2dep .vr_box .txt_box [data-skin="btn"]{position: relative; margin-top: 2em; padding: 0.383em 2.58em; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);}
#cyb_2dep .vr_box .txt_box [data-skin="btn"]:before{content: ""; display: inline-block; width: 2em; height: 2em; margin-right: 0.4em; background: url(../../../images/site/eng/content/cyb_2dep_img02.svg) no-repeat center center; background-size: contain; vertical-align: middle;}
#cyb_2dep .vr_box .txt_box [data-skin="btn"]:hover:before{background-image: url(../../../images/site/eng/content/cyb_2dep_img02_on.svg);}
#cyb_2dep .table td{padding:0.5em 0.625em;}
#cyb_2dep .table td [data-skin]:after{content: ""; display: block; clear: both;}
#cyb_2dep .table td [data-skin]{max-width: 24.4375em;}
#cyb_2dep .table td [data-skin] .bir_year{max-width: calc((100% - 1.4em) / 2);}
#cyb_2dep .table td [data-skin] .bir_year + span{display: inline-block; width: 1em; text-align: center;}


/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 사이버추모관 > 기억의 터(위폐관), 유해봉환 자료 검색 공통 > 동명이인 검색 목록
	연관단어 : .same_name

////////////////////////////////////////////////////////////////////////////// */
.same_name{}
.same_name .pro_list ul li p{position: relative;}

@media screen and (max-width:840px){
    .same_name .pro_list ul li .subject{width: 100%;}
    .same_name .pro_list ul li .b_date, 
    .same_name .pro_list ul li .d_date,
    .same_name .pro_list ul li .spouse,
    .same_name .pro_list ul li .mobil{display: inline-block; width: auto; padding: 0; font-size: 0.9em; text-align: left;}
}


/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 사이버추모관 > 기억의 터(위폐관), 유해봉환 자료 검색 공통 > 위패 상세페이지
	연관단어 : .tabl_wrap

////////////////////////////////////////////////////////////////////////////// */
.tabl_wrap{}
.tabl_wrap .tabl_box{text-align: center;}
.tabl_wrap .tabl_box .tabl_img{
    position: relative; z-index: 1; display: inline-block; width: 100%; max-width: 39.625em; margin: 0 5.5em 0 auto; 
    transition: font-size 0.2s ease; -webkit-transition: font-size 0.2s ease;
}
.tabl_wrap .tabl_box .tabl_img:before{
    content: ""; position: absolute; top: 0; left: 32%; z-index: 3; display: block; width: 25.6875em; height: 23.25em; background: url(../../../images/site/eng/content/cyb_2dep_img02.png) no-repeat center center; background-size: contain; 
    transform: translateX(-50%);-webkit-transform: translateX(-50%);
}
.tabl_wrap .tabl_box .tabl_img:after{
    content: ""; position: absolute; bottom: 4.2em; right: 25%; z-index: 2; display: block; width: 20.625em; height: 20.625em; background:  url(../../../images/site/eng/content/cyb_2dep_img03.png) no-repeat center center; background-size: contain;
    transform: translateX(50%);-webkit-transform: translateX(50%);
}
.tabl_wrap .tabl_box .tabl_img .imgbox{position: relative; z-index: 3; display: inline-block; width: 100%; height: 31.9375em; background: url(../../../images/site/eng/content/cyb_2dep_img04.png) no-repeat top right 10em; background-size: contain; text-indent: -9999px;}
.tabl_wrap .tabl_box .tabl_img ul{position: absolute; top: 0; right: 12.3125em; z-index: 3; width: 9.375em; height: calc(100% - 3.6em); padding: 7.3em 1em; box-sizing: border-box;}
.tabl_wrap .tabl_box .tabl_img ul:after{content: ""; display: block; clear: both;}
.tabl_wrap .tabl_box .tabl_img ul li{float: right; display: block; width: 1em; height: 100%; color: rgba(255, 255, 255, 0.6); font-family: 'Nanum Myeongjo'; }
.tabl_wrap .tabl_box .tabl_img ul li.d_date{margin-right: 0.1em; word-break: break-word;}
.tabl_wrap .tabl_box .tabl_img ul li.b_date span,
.tabl_wrap .tabl_box .tabl_img ul li.d_date span{display: block; width: 0.4em; margin: 0 auto; line-height: 1.3; word-break: break-word;}
.tabl_wrap .tabl_box .tabl_img ul li.d_date .dknow{ margin-top: 1.4em; width: 1em;}

.tabl_wrap .tabl_box .tabl_img ul li.names{
    position: absolute; top: 1em; left: 50%; font-size: 2.125em; color: #FFF; font-weight: 600; line-height: 2.7;
    transform: translateX(-50%); -webkit-transform: translateX(-50%); word-break: break-word;
    animation: fadein 4s;
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
.tabl_wrap .tabl_box .tabl_img ul li.names + .names{display: none;}
.tabl_wrap .tabl_box .tabl_img ul li.names.twos{top: 0; line-height: 5.1;}
.tabl_wrap .tabl_box .tabl_img ul li.names.fours{top: 1.4em; line-height: 1.9;}
.tabl_wrap .tabl_box .tabl_img ul li.spouse{position: absolute; top: 5.56em; left: 0.76em; font-size: 1.3125em; line-height: 1.4; word-break: break-word;}
.tabl_wrap .tabl_box .tabl_img ul li.spouse.twos{line-height: 4;}
.tabl_wrap .tabl_box .tabl_img ul li.spouse span{display: block; margin-bottom: 1.6em; word-break: break-word;}
.tabl_wrap .tabl_box .tabl_img ul li.spouse.twos span{margin-bottom: 0em; line-height: 1.4;}
.tabl_wrap .tabl_box .tabl_img ul li.spouse.fours span{margin-bottom: 1.2em;}

@media screen and (max-width:1024px){
    .tabl_wrap .tabl_box .tabl_img{font-size: 0.9em;}
}
@media screen and (max-width:840px){
    .tabl_wrap .tabl_box .tabl_img{font-size: 0.8em;}
}
@media screen and (max-width:740px){
    .tabl_wrap .tabl_box .tabl_img{font-size: 0.75em;}
}
@media screen and (max-width:640px){
    .tabl_wrap .tabl_box .tabl_img{font-size: 0.8em;}
    .tabl_wrap .tabl_box .tabl_img{max-width: 100%; margin: 0 auto; }
    .tabl_wrap .tabl_box .tabl_img .imgbox{background-position: top center;}
    .tabl_wrap .tabl_box .tabl_img ul{
        right: 50%; 
        transform: translateX(50%); -webkit-transform: translateX(50%);
    }
    .tabl_wrap .tabl_box .tabl_img:before{top: 3em; left: 27.5%; width: 20.55em; height: 18.6em;}
    .tabl_wrap .tabl_box .tabl_img:after{bottom: 4.2em; right: 30%; width: 16.5em; height: 20.625em;}
}
@media screen and (max-width:480px){
    .tabl_wrap .tabl_box .tabl_img{font-size: 0.7em;}
    .tabl_wrap .tabl_box .tabl_img:before{font-size: 0.9em; top: 4em; width: 19em; height: 16em;}
    .tabl_wrap .tabl_box .tabl_img:after{font-size: 0.9em; bottom: 4.2em;  width: 15em; height: 18em;}
}






@media screen and (max-width:1440px){
    #cyb_2dep .vr_box:before{width: 38.98125em;}
    #cyb_2dep .vr_box .txt_box{padding: 3em 1em 3em 40.5em;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 160px;}
}
@media screen and (max-width:1350px){
    #cyb_2dep .vr_box:before{width: 34.65em;}
    #cyb_2dep .vr_box .txt_box{padding: 2.5625em 1em 2.5625em 38em;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 145px;}
}
@media screen and (max-width:1250px){
    #cyb_2dep .vr_box{font-size: 0.95em;}
    #cyb_2dep .vr_box:before{width: 32.484375em;}
    #cyb_2dep .vr_box .txt_box{padding: 2em 1em 2em 35.5em;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 130px;}
}
@media screen and (max-width:1150px){
    #cyb_2dep .vr_box{font-size: 0.9em;}
    #cyb_2dep .vr_box:before{width: 30.4em;}
    #cyb_2dep .vr_box .txt_box{padding: 2em 1em 2em 33em;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 120px;}
}
@media screen and (max-width:1024px){
    #cyb_2dep .vr_box:before{width: 23.5em;}
    #cyb_2dep .vr_box .txt_box{padding: 0em 1em 0em 26em;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 100px;}
}
@media screen and (max-width:840px){
    #cyb_2dep{}
    #cyb_2dep .vr_box:before{
        position: relative; left: auto; top: auto; width: 26em; height: 21em; margin: 0 auto;
        transform: translateX(15%); -webkit-transform: translateX(15%);
    }
    #cyb_2dep .vr_box .txt_box{padding: 0; text-align: center; }
    #cyb_2dep .vr_box .txt_box strong{display: inline-block; padding-top: 1.3em;}
    #cyb_2dep .vr_box .txt_box strong:before{
        bottom: auto;
        top: 0;
        left: 50%;
        font-size: 70px;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
    }
    #cyb_2dep .vr_box .txt_box p{max-width: 100%; padding: 0 3%; box-sizing: border-box;}
    
}
@media screen and (max-width:640px){
    #cyb_2dep .vr_box{font-size: 0.8em;}
    #cyb_2dep .vr_box .txt_box{font-size: 1.1em;}
    #cyb_2dep .vr_box .txt_box strong{padding-top: 1.3em; line-height: 1.4;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 60px;}
    #cyb_2dep .vr_box .txt_box [data-skin="btn"]{font-size: 1.1em;}
}
@media screen and (max-width:480px){
    #cyb_2dep .vr_box{font-size: 0.7em;}
    #cyb_2dep .vr_box .txt_box{font-size: 1.2em;}
    #cyb_2dep .vr_box:before{
        transform: translateX(10%); -webkit-transform: translateX(10%);
    }
    #cyb_2dep .vr_box .txt_box strong{padding-top: 1em;}
    #cyb_2dep .vr_box .txt_box strong:before{font-size: 48px;}
}
@media screen and (max-width:380px){
    #cyb_2dep .vr_box:before{width: 24em; height: 19em;}
    #cyb_2dep .vr_box .txt_box{font-size: 1.2em;}
}

/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 사이버추모관 > 기억의 터(위폐관)
	연관단어 : #cyb_2dep.cyb_memo

////////////////////////////////////////////////////////////////////////////// */
#cyb_2dep.cyb_memo .vr_box:before{background-image: url(../../../images/site/eng/content/cyb_memo_img01.png);}

/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 사이버추모관 > 유해봉환 자료 검색
	연관단어 : #cyb_2dep.cyb_reli

////////////////////////////////////////////////////////////////////////////// */
#cyb_2dep.cyb_reli .vr_box:before{background-image: url(../../../images/site/eng/content/cyb_reli_img01.png);}


/* //////////////////////////////////////////////////////////////////////////////

	메뉴구조 : 기타 > 본인인증
	연관단어 : #etc_cert

////////////////////////////////////////////////////////////////////////////// */
#etc_cert .bot_box>ul>li
{transition:all 0.2s ease; -webkit-transition:all 0.2s ease;}

#etc_cert{}
#etc_cert [data-icon="yes"] .icon_wrap:before{background-image: url(../../../images/site/eng/content/etc_cert_img01.svg);}

#etc_cert .bot_box{margin-top: 1.5em;}
#etc_cert .bot_box>ul{overflow:hidden;}
#etc_cert .bot_box>ul>li{float:left; display:table; table-layout:fixed; width:calc((100% - 1.8em)/2); height:28.7em;}
#etc_cert .bot_box>ul>li:first-child{margin-right:1.8em;}
#etc_cert .bot_box>ul>li>div{display:table-cell; width:100%; height:100%; padding:3em 1em; border:1px solid #BFBFBF; vertical-align:middle; text-align:center; box-sizing:border-box;}
#etc_cert .bot_box>ul>li>div:before{content:""; display:block; width:8em; height:8em; margin:0 auto; background-repeat:no-repeat; background-position:center; background-size:100% auto; border-radius:50%;}
#etc_cert .bot_box>ul>li>div>strong{display:block; margin:1.3em 0 0.3em; font-size:1.2em; font-weight:500;}
#etc_cert .bot_box>ul>li>div>p+a{margin-top:1.3em;}
#etc_cert .bot_box>ul>li>div>p+p{margin-top:1.1em;}

#etc_cert .bot_box>ul>li:first-child>div:before{background-color:#EBEBE0; background-image:url(../../../images/site/eng/content/etc_cert_img02.svg);}
#etc_cert .bot_box>ul>li:nth-child(2)>div:before{background-color:#46644C; background-image:url(../../../images/site/eng/content/etc_cert_img03.svg);}

@media screen and (max-width:1024px){
    #etc_cert .bot_box>ul>li{width:calc((100% - 1.2em)/2);}
    #etc_cert .bot_box>ul>li:first-child{margin-right:1.2em;}
}
@media screen and (max-width:840px){
    #etc_cert .bot_box>ul>li{height:26em;}
   #etc_cert .bot_box>ul>li>div:before{font-size:0.85em;}
}
@media screen and (max-width:640px){   
    #etc_cert .bot_box>ul>li{float:none; width:100%; height:auto;}
    #etc_cert .bot_box>ul>li:first-child{margin-right:0; margin-bottom:1em;}
    #etc_cert .bot_box>ul>li>div{padding:2em 1em;}
}
