@charset "UTF-8";
@import url("layout.css");
@import url("contents.css");
@import url("/resources/css/common/print.css");
/*-------------------------------------------------
title       : 서브
Author      : PLAN I
Create date : 2025-01-31
-------------------------------------------------*/
#visual {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 20rem;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#visual strong {
  display: block;
  font-size: 4rem;
}
#visual img {
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  position: absolute;
  top: 0;
  z-index: -1;
  min-width: 100%;
  max-width: inherit;
  height: 30rem;
}
#visual .control a {
  display: inline-block;
  overflow: hidden;
  width: 6rem;
  height: 6rem;
  text-align: center;
  line-height: 6rem;
  vertical-align: middle;
  font-size: 3rem;
  top: 23rem;
  border-radius: 100%;
  border: 1px solid rgba(255, 255, 255, 0.5);
  -webkit-transition: var(--time2);
  transition: var(--time2);
}
#visual .control a[class*=prev] {
  position: absolute;
  left: 3rem;
}
#visual .control a[class*=prev]::before {
  font-family: "remixicon";
  content: "\ea64";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: inherit;
}
#visual .control a[class*=next] {
  position: absolute;
  right: 3rem;
}
#visual .control a[class*=next]::before {
  font-family: "remixicon";
  content: "\ea6e";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: inherit;
}
#visual .control a:hover, #visual .control a:focus {
  background-color: #fff;
  color: #000;
}

#tabmenu {
  margin-bottom: 6rem;
}
#tabmenu .depth1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  border-radius: 1.2rem 1.2rem 0 0;
  background-color: #243C51;
  font-size: 2.1rem;
  font-weight: 600;
  color: #fff;
}
#tabmenu .depth1 li {
  -webkit-box-flex: 1;
      -ms-flex: 1 1;
          flex: 1 1;
}
#tabmenu .depth1 .on a {
  background-color: #fff;
  color: #111;
}
#tabmenu .depth1 a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  height: 6.5rem;
  border-radius: 1.3rem 1.3rem 0 0;
  border: 1px solid #243C51;
  border-bottom: 0 none;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: var(--time2);
  transition: var(--time2);
}
#tabmenu .depth1 a:hover, #tabmenu .depth1 a:focus {
  background-color: #fff;
  color: #111;
}
#tabmenu .depth1.type1 {
  border-radius: 0.8rem;
  border: 1px solid #2B3D5E;
  background: none;
  font-size: inherit;
  font-weight: 600;
  color: #111;
}
#tabmenu .depth1.type1 .on a {
  background-color: #2B3D5E;
  color: #fff;
}
#tabmenu .depth1.type1 .on a::after {
  border: 0 none;
  background-color: #3F547C;
}
#tabmenu .depth1.type1 a {
  padding: 2rem;
  border-radius: 0;
  border: 0 none;
  text-align: left;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
}
#tabmenu .depth1.type1 a::after {
  display: inline-block;
  overflow: hidden;
  width: 2.5rem;
  height: 2.5rem;
  text-align: center;
  line-height: 2.5rem;
  vertical-align: middle;
  font-family: "remixicon";
  content: "\ea4e";
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  position: absolute;
  right: 2rem;
  border-radius: var(--brd);
  border: 1px solid #000;
  -webkit-transition: var(--time2);
  transition: var(--time2);
}
#tabmenu .depth1.type1 a:hover::after, #tabmenu .depth1.type1 a:focus::after {
  border: 0 none;
  background-color: #3F547C;
  color: #fff;
}
#tabmenu .depth2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid var(--bdc);
  font-size: 1.9rem;
  font-weight: 600;
  white-space: nowrap;
}
#tabmenu .depth2 li {
  -webkit-box-flex: 1;
      -ms-flex: 1 1;
          flex: 1 1;
}
#tabmenu .depth2 li + li a::before {
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  position: absolute;
  left: 0;
  width: 1px;
  height: 1.5rem;
  background-color: var(--bdc);
  content: "";
}
#tabmenu .depth2 a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  height: 6.5rem;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#tabmenu .depth2 a::after {
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  position: absolute;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: var(--cl);
  content: "";
  -webkit-transition: var(--time2);
  transition: var(--time2);
}
#tabmenu .depth2 a:hover::after, #tabmenu .depth2 a:focus::after {
  width: 100%;
}
#tabmenu .depth2 a::after {
  height: 0.5rem;
}
#tabmenu .depth2 .on a {
  font-weight: 600;
  color: #0975BA;
}
#tabmenu .depth2 .on a::after {
  width: 100%;
  background-color: #0975BA;
}

/* /mum/old/sub_old.css */
body {overflow-y: scroll;}
.container {position:relative;width:100% !important}

.heading01{display:block;text-align:center;color:#000;font-size:45px;font-weight:100;}
.heading01 > strong{display:inline-block;font-weight:400;}

/*history - 2019.03.05 박가혜*/
#contents{background:url('/resources/images/mum/sub/section_bg.jpg')no-repeat 0 0/cover;overflow:hidden;padding:100px 0; min-height: calc(100vh - 70px);}
#contents:has(.photo-wrap) {padding: 0;}
/*.section1 {height:calc(100vh - 70px);}*/
.section1 {padding-bottom:0}
.section1 .bx-wrapper,.history-wrap{height:783px}/* history는 높이 고정 */
.history-wrap:before{position:absolute;top:50%;left:180px;transform:translateY(-50%);width:calc(100% - 180px);height:50px;content:'';background:#818b9f}

.history{/*margin:100px 180px 0*/margin:100px 0 0;height:100%}
.history01 {margin-right:0}
/*.history:before{position:absolute;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);left:-180px;width:100%;height:50px;content:'';}*/
.history-depth01 {width:calc(100% - 360px);margin:auto;position:relative;height:100%}
.history-depth01 > li{position:absolute;display:inline-block;vertical-align:bottom;color:#555;max-width:520px;min-width:400px;font-weight:100;margin-right:10px;}
.history-depth01 > li:nth-child(odd){padding-bottom:150px;}
.history-depth01 > li:nth-child(even){padding-top: 100px;}
.history-depth01 > li:before{position:absolute;left:0;top:0;width:1px;height:100%;background:#9ba7be;content:'';}
.history-depth01 > li > strong{position:absolute;padding-left:20px;}
.history-depth01 > li .img {position:relative}
.history-depth01 > li:nth-child(odd) > strong{bottom:13px;}
.history-depth01 > li:nth-child(odd) .img {margin-bottom:24px}
.history-depth01 > li:nth-child(even) > strong{top:11px;}
.history-depth01 > li:nth-child(even) .img {margin-top:24px}
/*.history-depth01> li:nth-child(even){position:absolute;top:335px;left:0;}*/
.history-depth01 > li strong {font-weight:600}

.history01 .history-depth01> li:nth-child(1) {left:0;top:127px}
.history01 .history-depth01> li:nth-child(2) {left:220px;top:268px}
.history01 .history-depth01> li:nth-child(3) {left: 482px;top:-14px;}
.history01 .history-depth01> li:nth-child(4) {left: 722px;top:267px;}
.history01 .history-depth01> li:nth-child(5) {left: 1016px;top:127px;}
.history01 .history-depth01> li:nth-child(6) {left: 1169px;top: 268px;}

.history02 .history-depth01> li:nth-child(1) {left:50px;top: 142px;}
.history02 .history-depth01> li:nth-child(2) {left: 293px;top:268px;}
.history02 .history-depth01> li:nth-child(3) {left: 486px;top: -24px;}
.history02 .history-depth01> li:nth-child(4) {left: 874px;top:267px;}
.history02 .history-depth01> li:nth-child(5) {left: 1188px;top: 112px;}

.history03 .history-depth01> li:nth-child(1) {left: 50px;top: 22px;}
.history03 .history-depth01> li:nth-child(2) {left:220px;top:268px}
.history03 .history-depth01> li:nth-child(3) {left: 610px;top: 127px;}
.history03 .history-depth01> li:nth-child(4) {left: 845px;top:267px;}
.history03 .history-depth01> li:nth-child(5) {left: 1113px;top:127px;}

.history04 .history-depth01> li:nth-child(1) {left: 50px;top:127px;}
.history04 .history-depth01> li:nth-child(2) {left:220px;top:268px}
.history04 .history-depth01> li:nth-child(3) {left: 538px;top: 142px;}
.history04 .history-depth01> li:nth-child(4) {left: 834px;top:267px;}
.history04 .history-depth01> li:nth-child(5) {left: 974px;top:-24px;}


.history05 .history-depth01> li:nth-child(1) {left: 50px;top: 142px;}
.history05 .history-depth01> li:nth-child(2) {left:220px;top:268px}
.history05 .history-depth01> li:nth-child(3) {left:450px;top: 142px;}
.history05 .history-depth01> li:nth-child(4) {left: 687px;top:267px;}
.history05 .history-depth01> li:nth-child(5) {left:973px;top: 112px;}
.history05 .history-depth01> li:nth-child(6) {left: 1232px;top: 267px;}



/*.history01 .history-depth01> li:nth-child(odd) {margin-top:175px}
.history01 .history-depth01> li:nth-of-type(2){left:220px;}
.history01 .history-depth01> li:nth-of-type(3){left:150px;}
.history01 .history-depth01> li:nth-of-type(4){left:670px;}
.history01 .history-depth01> li:nth-of-type(6){left:1200px;}
.history02 .history-depth01> li:nth-child(odd) {margin-top:130px}
.history02 .history-depth01> li:nth-of-type(2){left:200px;}
.history02 .history-depth01> li:nth-of-type(4){left:670px;}
.history02 .history-depth01> li:nth-of-type(6){left:1200px;}
.history03 .history-depth01> li:nth-child(odd) {margin-top:74px}
.history03 .history-depth01> li:nth-of-type(2){left:130px;}
.history03 .history-depth01> li:nth-of-type(4){left:670px;}
.history03 .history-depth01> li:nth-of-type(6){left:1200px;}
.history04 .history-depth01> li:nth-child(odd) {margin-top:10px}
.history04 .history-depth01> li:nth-of-type(2){left:130px;}
.history04 .history-depth01> li:nth-of-type(4){left:670px;}
.history04 .history-depth01> li:nth-of-type(6){left:1200px;}
.history05 .history-depth01> li:nth-child(odd) {margin-top:115px}
.history05 .history-depth01> li:nth-of-type(2){left:130px;}
.history05 .history-depth01> li:nth-of-type(4){left:670px;}
.history05 .history-depth01> li:nth-of-type(6){left:1200px;}*/
.history-depth01 > li > strong{display:block;font-size:20px;font-family: 'Titillium Web', sans-serif;font-weight:600;color:#fff}
.history-depth02 > li > span{display:inline-block;font-size:20px;font-family: 'Titillium Web', sans-serif;font-weight:600;color:#000;vertical-align:top;width:13%;padding-left:15px;min-width:80px;}
.history01 .history-depth02 > li > span,
.history02 .history-depth02 > li > span,
.history03 .history-depth02 > li > span{width:20%}
.history-depth02 > li > em{display:inline-block;vertical-align:top;width:78%;word-break:keep-all;}
.history-depth02 > li + li{margin-top:5px}
/*.history-depth02{max-height:337px;}
.history02 .history-depth01{margin-top:5px;}
.history03 .history-depth01{margin-top:16px;}
.history04 .history-depth01{margin-top:155px;}
.history05 .history-depth01{margin-top:65px;}
.history03 .history-depth01> li:nth-child(even) {top:320px}
.history04 .history-depth01> li:nth-child(even) {top:180px}
.history05 .history-depth01> li:nth-child(even) {top:270px}*/
.section1 .bx-controls.bx-has-controls-direction{position:absolute;top:15px;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);}
.section1 .bx-controls a{position:relative;display:inline-block;width:43px;height:43px;border-radius:50%;background:#000;font-size:0;}
.section1 .bx-controls a + a{margin-left:10px;}
.section1 .bx-controls a::before{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);content:'\e93d';font-family:'xeicon';color:#ccc;font-size:20px;}
.section1 .bx-controls a.bx-next::before{content:'\e940';}
.section1 .bx-controls a.disabled {background:#818b9f;cursor:default}

.photo-wrap {height:100vh;transition:all .4s}
.years-navi {position:fixed;top:50%;transform:translateY(-50%);right:77px;z-index:10}
.years-navi:after {position:absolute;right:6px;top:50%;transform:translateY(-50%);width:1px;height:100vh;background:#fff;opacity:.5;content:''}
.years-navi a {color:#fff;font-size:30px;font-family:'Titillium Web',sans-serif;}
.years-navi li {margin-top:23px}
.years-navi li:first-child {margin-top:0}
.years-navi li a:after {display:inline-block;width:8px;height:8px;background:#fff;border-radius:50%;content:'';vertical-align:middle;margin-left:12px;transition:height .4s} 
.years-navi li span {opacity:0;transition:all .4s}
/* 동그라미 */
.fp-viewing-1Page .years-navi li:first-child a:after, .fp-viewing-2Page .years-navi li:first-child a:after,
.fp-viewing-3Page .years-navi li:first-child a:after,.fp-viewing-4Page .years-navi li:first-child a:after,
.fp-viewing-5Page .years-navi li:nth-of-type(2) a:after, .fp-viewing-6Page .years-navi li:nth-of-type(2) a:after,
.fp-viewing-7Page .years-navi li:nth-of-type(2) a:after, .fp-viewing-8Page .years-navi li:nth-of-type(2) a:after,
.fp-viewing-9Page .years-navi li:nth-of-type(2) a:after, .fp-viewing-10Page .years-navi li:nth-of-type(2) a:after,
.fp-viewing-11Page .years-navi li:nth-of-type(2) a:after, .fp-viewing-12Page .years-navi li:nth-of-type(2) a:after,
.fp-viewing-13Page .years-navi li:nth-of-type(2) a:after, .fp-viewing-14Page .years-navi li:nth-of-type(2) a:after,
.fp-viewing-15Page .years-navi li:nth-of-type(2) a:after, .fp-viewing-16Page .years-navi li:nth-of-type(3) a:after,
.fp-viewing-17Page .years-navi li:nth-of-type(3) a:after, .fp-viewing-18Page .years-navi li:nth-of-type(3) a:after,
.fp-viewing-19Page .years-navi li:last-child a:after, .fp-viewing-20Page .years-navi li:last-child a:after,
.fp-viewing-21Page .years-navi li:last-child a:after, .fp-viewing-22Page .years-navi li:last-child a:after,
.fp-viewing-23Page .years-navi li:last-child a:after, .fp-viewing-24Page .years-navi li:last-child a:after,
.fp-viewing-25Page .years-navi li:last-child a:after, .fp-viewing-26Page .years-navi li:last-child a:after,
.fp-viewing-27Page .years-navi li:last-child a:after, .fp-viewing-28Page .years-navi li:last-child a:after,
.fp-viewing-29Page .years-navi li:last-child a:after, .fp-viewing-30Page .years-navi li:last-child a:after,
.fp-viewing-31Page .years-navi li:last-child a:after, .fp-viewing-32Page .years-navi li:last-child a:after,
.fp-viewing-33Page .years-navi li:last-child a:after, .fp-viewing-34Page .years-navi li:last-child a:after,
.fp-viewing-35Page .years-navi li:last-child a:after, .fp-viewing-36Page .years-navi li:last-child a:after,
.fp-viewing-37Page .years-navi li:last-child a:after, .fp-viewing-38Page .years-navi li:last-child a:after,
.fp-viewing-39Page .years-navi li:last-child a:after,.fp-viewing-40Page .years-navi li:last-child a:after {width:13px;height:13px;margin-left:10px}
/* 년도 */
.fp-viewing-1Page .years-navi li:first-child span, .fp-viewing-2Page .years-navi li:first-child span,
.fp-viewing-3Page .years-navi li:first-child span,.fp-viewing-4Page .years-navi li:first-child span,
.fp-viewing-5Page .years-navi li:nth-of-type(2) span, .fp-viewing-6Page .years-navi li:nth-of-type(2) span,
.fp-viewing-7Page .years-navi li:nth-of-type(2) span, .fp-viewing-8Page .years-navi li:nth-of-type(2) span,
.fp-viewing-9Page .years-navi li:nth-of-type(2) span, .fp-viewing-10Page .years-navi li:nth-of-type(2) span,
.fp-viewing-11Page .years-navi li:nth-of-type(2) span, .fp-viewing-12Page .years-navi li:nth-of-type(2) span,
.fp-viewing-13Page .years-navi li:nth-of-type(2) span, .fp-viewing-14Page .years-navi li:nth-of-type(2) span,
.fp-viewing-15Page .years-navi li:nth-of-type(2) span, .fp-viewing-16Page .years-navi li:nth-of-type(3) span,
.fp-viewing-17Page .years-navi li:nth-of-type(3) span, .fp-viewing-18Page .years-navi li:nth-of-type(3) span,
.fp-viewing-19Page .years-navi li:last-child span, .fp-viewing-20Page .years-navi li:last-child span,
.fp-viewing-21Page .years-navi li:last-child span, .fp-viewing-22Page .years-navi li:last-child span,
.fp-viewing-23Page .years-navi li:last-child span, .fp-viewing-24Page .years-navi li:last-child span,
.fp-viewing-25Page .years-navi li:last-child span, .fp-viewing-26Page .years-navi li:last-child span,
.fp-viewing-27Page .years-navi li:last-child span, .fp-viewing-28Page .years-navi li:last-child span,
.fp-viewing-29Page .years-navi li:last-child span, .fp-viewing-30Page .years-navi li:last-child span,
.fp-viewing-31Page .years-navi li:last-child span, .fp-viewing-32Page .years-navi li:last-child span,
.fp-viewing-33Page .years-navi li:last-child span, .fp-viewing-34Page .years-navi li:last-child span,
.fp-viewing-35Page .years-navi li:last-child span ,.fp-viewing-36Page .years-navi li:last-child span,
.fp-viewing-37Page .years-navi li:last-child span ,.fp-viewing-38Page .years-navi li:last-child span,
.fp-viewing-39Page .years-navi li:last-child span,.fp-viewing-40Page .years-navi li:last-child span{opacity:1 !important}




.photo-wrap .section {background-position:center;background-repeat:no-repeat;background-size:cover;position:relative}
.photo-wrap .section:before {position:absolute;left:0;top:0;width:100%;height:100%;background:#000;opacity:.3;content:''}
/*.photo-wrap .section:before {position:absolute;right:0;top:0;width:100%;height:100vh;content:'';background-position:center;background-repeat:no-repeat;background-size:cover;transition:all .6s}*/
.photo-wrap .section .fp-tableCell {position:relative;}
.photo-wrap .txt-wrap {position:absolute;left:100px;bottom:250px;color:#fff;transition:all .4s}
/*#contents.comment-active .photo-wrap .section:before {width:calc(100% - 570px)}*/
#contents.comment-active .photo-wrap .txt-wrap {left:670px}
.photo-wrap .txt-wrap .date {font-size:95px;font-family:'Titillium Web',sans-serif;text-indent:-6px}
.photo-wrap .txt-wrap .date:after {display:block;content:'';width:46px;height:4px;background:#fff;margin:20px 0 20px 5px}
.photo-wrap .txt-wrap .tit {font-size:30px;margin-bottom:17px}
.photo-wrap .txt-wrap .comment-btn {position:relative;font-size:20px;font-family:'Titillium Web',sans-serif;display:block;height:83px;line-height:83px}
.photo-wrap .txt-wrap .comment-btn:before {position:absolute;display:inline-block;width:83px;height:83px;background:#000;border-radius:50%;content:''}
.photo-wrap .txt-wrap .comment-btn span {position:relative;z-index:1;margin-left:22px;padding-right:34px}
.photo-wrap .txt-wrap .comment-btn span:before,.photo-wrap .txt-wrap .comment-btn span:after {position:absolute;right:0;content:'';height:1px;background:#fff;transition:all .4s}
.photo-wrap .txt-wrap .comment-btn span:before {top:50%;transform:translateY(-50%);width:28px;}
.photo-wrap .txt-wrap .comment-btn span:after {top:11px;width:10px;transform:rotate(45deg);}
.photo-wrap .txt-wrap .comment-btn:hover span:before, .photo-wrap .txt-wrap .comment-btn:hover span:after,
.photo-wrap .txt-wrap .comment-btn:focus span:before, .photo-wrap .txt-wrap .comment-btn:focus span:after {right:-6px} 
.photo-wrap #year00 {background-image:url('/resources/images/mum/sub/year_00.jpg')}
.photo-wrap #year010 {background-image:url('/resources/images/mum/sub/year_001.jpg')}
.photo-wrap #year01 {background-image:url('/resources/images/mum/sub/year_01.jpg')}
.photo-wrap #year02 {background-image:url('/resources/images/mum/sub/year_02.jpg')}
.photo-wrap #year020 {background-image:url('/resources/images/mum/sub/year_2_1.jpg')}
.photo-wrap #year03 {background-image:url('/resources/images/mum/sub/year_03.jpg')}
.photo-wrap #year04 {background-image:url('/resources/images/mum/sub/year_04.jpg')}
.photo-wrap #year05 {background-image:url('/resources/images/mum/sub/year_05.jpg')}
.photo-wrap #year06 {background-image:url('/resources/images/mum/sub/year_06.jpg')}
.photo-wrap #year07 {background-image:url('/resources/images/mum/sub/year_07.jpg')}
.photo-wrap #year08 {background-image:url('/resources/images/mum/sub/year_08.jpg')}
.photo-wrap #year080 {background-image:url('/resources/images/mum/sub/year_8_1.jpg')}
.photo-wrap #year09 {background-image:url('/resources/images/mum/sub/year_09.jpg')}
.photo-wrap #year10 {background-image:url('/resources/images/mum/sub/year_10.jpg')}
.photo-wrap #year11 {background-image:url('/resources/images/mum/sub/year_11.jpg')}
.photo-wrap #year12 {background-image:url('/resources/images/mum/sub/year_12.jpg')}
.photo-wrap #year13 {background-image:url('/resources/images/mum/sub/year_13.jpg')}
.photo-wrap #year14 {background-image:url('/resources/images/mum/sub/year_14.jpg')}
.photo-wrap #year15 {background-image:url('/resources/images/mum/sub/year_15.jpg')}
.photo-wrap #year16 {background-image:url('/resources/images/mum/sub/year_16.jpg')}
.photo-wrap #year17 {background-image:url('/resources/images/mum/sub/year_17.jpg')}
.photo-wrap #year18 {background-image:url('/resources/images/mum/sub/year_18.jpg')}
.photo-wrap #year180 {background-image:url('/resources/images/mum/sub/year_36.jpg')}
.photo-wrap #year19 {background-image:url('/resources/images/mum/sub/year_19.jpg')}
.photo-wrap #year20 {background-image:url('/resources/images/mum/sub/year_20.jpg')}
.photo-wrap #year21 {background-image:url('/resources/images/mum/sub/year_21.jpg')}
.photo-wrap #year22 {background-image:url('/resources/images/mum/sub/year_22.jpg')}
.photo-wrap #year23 {background-image:url('/resources/images/mum/sub/year_23.jpg')}
.photo-wrap #year24 {background-image:url('/resources/images/mum/sub/year_24.jpg')}
.photo-wrap #year25 {background-image:url('/resources/images/mum/sub/year_25.jpg')}
.photo-wrap #year26 {background-image:url('/resources/images/mum/sub/year_26.jpg')}
.photo-wrap #year27 {background-image:url('/resources/images/mum/sub/year_27.jpg')}
.photo-wrap #year28 {background-image:url('/resources/images/mum/sub/year_28.jpg')}
.photo-wrap #year29 {background-image:url('/resources/images/mum/sub/year_29.jpg')}
.photo-wrap #year30 {background-image:url('/resources/images/mum/sub/year_30.jpg')}
.photo-wrap #year31 {background-image:url('/resources/images/mum/sub/year_31.jpg')}
.photo-wrap #year32 {background-image:url('/resources/images/mum/sub/year_32.jpg')}
.photo-wrap #year33 {background-image:url('/resources/images/mum/sub/year_33.jpg')}
.photo-wrap #year34 {background-image:url('/resources/images/mum/sub/year_34.jpg')}
.photo-wrap #year35 {background-image:url('/resources/images/mum/sub/year_35.jpg')}

.comment-wrap {position:absolute;left:-660px;top:70px;background:#4f535d;width:570px;height:100vh;padding:28px 38px;z-index:10;transition:all .5s}
.comment-wrap .close-btn {position:absolute;right:30px;top:58px;font-size:30px;transition:all .4s}
.comment-wrap .close-btn:hover, .comment-wrap .close-btn:focus {transform:rotate(180deg)}
.comment-wrap .mCustomScrollbar {height:60%;margin-top:40px}
.comment-wrap .mCSB_inside>.mCSB_container {margin-right:38px}
.comment-wrap h2 {font-size:30px;font-family:'Titillium Web',sans-serif;padding-bottom:12px;margin:30px 0;border-bottom:3px solid #656a76}
.comment-wrap .form-wrap > * {display:block;width:100%;border:1px solid #656a76;color:#aeb1ba;background:none}
.comment-wrap .form-wrap input[type="text"] {padding:0 23px;height:40px;line-height:40px}
.comment-wrap .form-wrap textarea {resize:none;margin-top:11px;height:150px;padding:23px;transition:all .4s}
.comment-wrap .form-wrap input[type="text"]:hover, .comment-wrap .form-wrap input[type="text"]:focus,
.comment-wrap .form-wrap textarea:hover,.comment-wrap .form-wrap textarea:focus {border-color:#fff;color:#fff}
.comment-wrap .form-wrap button {background:#fff;border:1px solid #fff;color:#4f535d;font-weight:700;padding:8px;margin-top:10px;transition:inherit;transition:all .4s}
.comment-wrap .form-wrap button:hover, .comment-wrap .form-wrap button:focus {background:none;color:#fff}
.comment-wrap .comment .txt,.comment-wrap .comment .date {color:#aeb1ba}
.comment-wrap h2, .comment-wrap .comment .user, .comment-wrap .close-btn {color:#fff}
.comment-wrap .comment li {position:relative;padding:34px 0;border-top:1px solid #656a76}
.comment-wrap .comment .user {margin-bottom:24px}
.comment-wrap .comment .user i {font-size:26px;vertical-align:middle}
.comment-wrap .comment .user span {vertical-align:middle;margin-left:6px}
.comment-wrap .comment .txt {line-height:1.4;margin-bottom:14px}
.comment-wrap .comment .btn-wrap {position:absolute;top:33px;right:0}
.comment-wrap .comment .btn-wrap a {color:#aeb1ba;transition:all .4s;display:inline-block;vertical-align:middle}
.comment-wrap .comment .btn-wrap a:first-child {position:relative;padding-right:10px;margin-right:6px}
.comment-wrap .comment .btn-wrap a:first-child:after {position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:10px;background:#aeb1ba;content:''}
.comment-wrap .comment .btn-wrap a:hover,.comment-wrap .comment .btn-wrap a:focus {color:#fff;text-decoration:underline}
.comment-wrap .comment li:first-child {border-top:0;padding-top:0}
.comment-wrap .comment li:first-child .btn-wrap {top:0}
.comment-wrap.active {left:0} 

.data-tab {text-align:center;overflow:hidden;width:900px;margin:0 auto 49px}
.data-tab a {position:relative;float:left;display:inline-block;width:180px;height:48px;line-height:48px;background:#fff;font-size:18px;color:#555;transition:color .4s;transition-delay:.4s}
.data-tab a:before {position:absolute;left:0;top:0;width:100%;height:100%;content:'';border:1px solid #d0d0d0;border-left:0;}
.data-tab a:after {position:absolute;left:0;bottom:0;width:100%;height:0;background:#000;content:'';transition:all .4s}
.data-tab a:first-child:before {border-left:1px solid #d0d0d0}
.data-tab a span {position:relative;z-index:1}
.data-tab a.active,.data-tab a:hover {color:#fff;font-weight:600}
.data-tab a.active:after,.data-tab a:hover:after {height:100%}

.g-wrap {}
.g-search-area {width:1200px;margin:0 auto;}
.g-search-area:before {position:fixed;left:0;top:0;background:#000;width:100%;height:0;content:'';z-index:-10;transition:height .6s,opacity .6s}
.g-search-area.active:before {z-index:100;opacity:.7;height:100%}
.krds-structured-list {margin:-23px 0 0 -23px}
.krds-structured-list:after {display:block;clear:both;content:''}
.krds-structured-list > li {display: block;float: left;width:calc(25% - 23px);opacity: 0;border:1px solid #e6e6e6;margin:23px 0 0 23px}
.krds-structured-list > li a {display:block;height:100%}
.krds-structured-list > li .c-text {text-align:center;background:#fff;color:#000;font-size:18px;border-top:1px solid #e6e6e6;background:#eee;padding:0 10px;word-break:keep-all;display:table;width:100%;height:95px}
.krds-structured-list > li .c-text .c-tit {display:table-cell;vertical-align:middle}
.krds-structured-list > li .c-text .c-tit + p {display: none;}
.krds-structured-list > li.shown {opacity: 1;}
.krds-structured-list > li a,.krds-structured-list li img {display: block;max-width: 100%;}
.krds-structured-list > li a:hover .c-text .c-tit {text-decoration:underline}
.krds-structured-list > li a .img-wrap img {width: 100%;}
.krds-structured-list .btn-wrap {display: none;}
/* Effect 3: Scale up */
.g-search-area .krds-structured-list > li.shown, .g-search-area .krds-structured-list > li.animate {
	-webkit-transform: scale(0.6);
	transform: scale(0.6);
	-webkit-animation: scaleUp 0.45s ease-in-out forwards;
	animation: scaleUp 0.45s ease-in-out forwards;
}

.g-search-area .search-top-box,
.g-search-area #searchForm,
.g-search-area .viewtype,
.g-search-area .search-list-top {display: none !important;}

@-webkit-keyframes scaleUp {
	0% { }
	100% { -webkit-transform: scale(1); opacity: 1; }
}

@keyframes scaleUp {
	0% { }
	100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
}


.data-pop {position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:760px;height:670px;z-index:-10;opacity:0;}
.data-pop.active {transition:opacity .4s;transition-delay:.4s}
.data-pop p {height:60px;line-height:60px;font-size:25px;color:#fff;background:#010101;padding:0 30px}
.data-pop .data-cont {text-align:center;padding:20px;width:100%;height:610px;background:#fff}
.data-pop .data-cont img {max-height:100%}
.data-pop .pop-close {width:60px;height:60px;position:absolute;right:0;top:0;color:#fff;line-height:60px;font-size:30px;}
.data-pop .pop-close i {transition:all .4s}
.data-pop .pop-close:hover i {transform:rotate(180deg)}
.data-pop.active {opacity:1;z-index:101}

.board_pager {margin-top:50px;text-align:center;}
.board_pager a,
.board_pager > span a {background:transparent; display:inline-block;width:40px;height:40px;line-height:37px;border:1px solid #e5ebf0;color:#666;transition:all .4s;vertical-align:middle; border-radius: 0;}
.board_pager > span a + a {margin:0 4px}
.board_pager a.first .xi-angle-left:before {margin-right:-5px}
.board_pager a.first .xi-angle-left:after{content:'\e93b';margin-left:-5px}
.board_pager a.last .xi-angle-right:before {margin-right:-5px}
.board_pager a.last .xi-angle-right:after{content:'\e93e';margin-left:-5px}
.board_pager span {padding:0 1rem}
.board_pager span a {margin:0 .3rem;}
.board_pager a.active,
.board_pager > span a.active {border-color:#ed6f00;background:#ed6f00;color:#fff}
.board_pager a:hover,
.board_pager a:focus,
.board_pager > span a:hover,
.board_pager > span a:focus {border-color:#ed6f00;color:#ed6f00}
.board_pager + .btn-wrap {margin-top:-40px}

@media(max-height:1080px){
	.comment-wrap .mCustomScrollbar {height:335px}	
}