#content:not(.main) {
  padding-top: 40px;
}

.bg-grey {
  background-color: #f2f2f2;
}

.border-radius-5 {
  border-radius: 5px;
  overflow: hidden;
  display: block;
}

.border-radius-10 {
  border-radius: 10px;
  overflow: hidden;
  display: block;
}

.border-radius1-5 {
  border-radius: 15px;
  overflow: hidden;
  display: block;
}

.border-radiu20-5 {
  border-radius: 20px;
  overflow: hidden;
  display: block;
}

dl{
  margin-bottom: 0;
}

dd {
  padding-left: 1em;
  position: relative;
}

dd:before {
  content: '·';
  position: absolute;
  top: 0;
  left: 0;
}

.wrap-video {
  width: 100%;
  height: 0;
  position: relative;
}

.wrap-video > iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.page-head {
  position: relative;
  height: 47.5vh;
  background-position: center;
  background-size: cover;
}

.page-head .text {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  color: #fff;
}

.page-body {
  /* padding-bottom: 8vh; */
}

.list-title {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, .3);
  color: #fff;
  padding-bottom: 8vh
}

.list-title h2 {
  font-size: 2.8rem;
  line-height: 1.2;
  padding: .2em 0 .3em;
}

.list-title h2:only-child {
  padding: 0;
}

.list-title h2.small {
  font-size: 2.5rem;
}

.list-title h3 {
  font-size: 1.3rem;
  font-weight: 100;
  line-height: 1.5;
}

.list-title p {
  font-size: 1.2rem;
  padding-top: 1.5em;
}

#content:not(.main) .title-text {
  font-size: 1.2rem;
}

#content:not(.main) .title-text h3 {
  font-size: 2rem;
  line-height: 1.4;
  font-weight: normal;
  color: #00234f;
}

#content:not(.main) .title-text h3.bold,
.title-text h3 .bold {
  font-weight: bold
}

#content:not(.main) .title-text p.small {
  font-size: .9rem;
}

.title-text2.text-lg-center {
  padding: 5rem 0 3rem;
}

.title-text2.text-lg-center h4 {
  font-size: 2rem;
  font-weight: 900;
  line-height: 1.5;
  margin-bottom: 20px;
}

.row.progress {
  padding: 0;
  position: relative;
}

.row.progress:before {
  content: '';
  display: block;
  background-color: #00234f;
  position: absolute;
  width: 2px;
  height: calc(100% + 11vh + 8.7rem);
  bottom: 0;
  left: 55px;
}

.row.progress .bold {
  font-size: 1.5rem;
  font-weight: bold;
  letter-spacing: -1px;
  line-height: 1.2;
  padding-bottom: .8em;
  display: block;
}

.row.progress .item > p,
.row.progress .item dd {
  font-size: 1.2rem;
  line-height: 1.5;
  letter-spacing: -0.7px;
}

.row.progress .item {
  /*  margin-top: -110px;*/
  margin-top: 0px;
  padding-left: 120px;
  padding-right: 30px;
  margin-bottom: 2rem;
}

.row.progress .item:before {
  content: attr(data-number);
  line-height: 3;
  text-align: center;
  color: #ffffff;
  width: 60px;
  height: 60px;
  background-color: #00234f;
  display: block;
  border-radius: 100px;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 60px;
  margin-bottom: 40px;
  margin-top: -14px;

  position: absolute;
  left: 26px;
  /*
  width: 40px;
  height: 40px;
  font-size: 15px;
  line-height: 40px;
*/
}

.row.progress dl {
  margin-bottom: 1.3rem;
}

.deco-bg {
  color: #012350;
  position: relative;
/*  display: inline-block;*/
  line-height: 1;
  font-weight: 700;
}

.box-shadow {
  box-shadow: 5px 5px 30px rgba(0, 0, 0, .2);
}

/* 문재인의 한반도 정책 - 01. 베를린 구상 */
.sub02_1 {
  font-size: 1rem;
  padding: 1vh 0;
}

.sub02_1 section {
  padding: 11vh 0;
}

.sub02_1 #sect0 .title {
  width: 100%;
  text-align: center;
  letter-spacing: -3px;
  padding: 5vh 0;
}

.sub02_1 #sect0 .title h3 {
  font-size: 3rem;
  color: #00234f;
  font-weight: bold;
  line-height: 1.2;
  font-weight: bold;
}

.sub02_1 #sect0 .row {
  text-align: center;
  padding: 5vh 2vw 0;
}

.sub02_1 #sect0 .row .bx-text {
  text-align: left;
  color: black;
  line-height: 3;
}

.sub02_1 #sect0 .row .bx-text .main-text {
  font-size: 2rem;
  font-weight: 100;
  line-height: 1.35;
  letter-spacing: -1.6px;
  margin-bottom: 1rem;
}

.sub02_1 #sect0 .row .bx-text .sub-text {
  font-weight: 300;
  line-height: 1.67;
  letter-spacing: -0.7px;
}

.sub02_1 #sect0 .row img {
  width: 14vh;
}

.sub02_1 #sect0 .area-btn a {
  display: inline-block;
  font-size: 1.3rem;
  color: #012350;
  font-weight: bold;
  position: relative;
}

.sub02_1 #sect0 .area-btn a:before {
  content: '▶';
  color: #fff;
  line-height: 4rem;
  width: 4rem;
  height: 4rem;
  border-radius: 100%;
  display: block;
  background-color: #012350;
  margin: 0 auto .8rem;
  transition: all .5s ease;
}

.sub02_1 #sect0 .area-btn a:after {
  content: '';
  width: 5rem;
  height: 5rem;
  border-radius: 100%;
  border: 1px solid #012350;
  position: absolute;
  top: -.5rem;
  left: 50%;
  margin-left: -2.5rem;
}

.sub02_1 #sect0 .area-btn a:hover:before {
  transform: scale(1.2)
}

.sub02_1 #sect1 .title {
  width: 100%;
  padding-left: 100px;
  padding-bottom: 8vh;
}

.sub02_1 #sect1 .title h3 {
  font-size: 2rem;
  line-height: 1.35;
  letter-spacing: -1.6px;
  color: #00234f;
  font-weight: bold;
}

.sub02_1 #sect2 .container-fluid {
  max-width: 1620px;
}

.sub02_1 #sect2 .bx-grey {
  width: 100%;
  background-color: #b1b1b1;
}

.sub02_1 #sect2 .bx-grey .text {
  font-size: 3rem;
  line-height: 1.2;
  letter-spacing: -2.4px;
  color: #ffffff;
  padding: 3rem;
}

.sub02_1 #sect2 .bx-grey .text strong {
  font-weight: bold;
}

.sub02_1 #sect2 .col-lg-8 .col-6 {
  width: 100%;
  height: 400px;
  padding: 3rem;
}

.sub02_1 #sect2 .col-lg-8 .col-6 .text {
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.35;
  letter-spacing: -1.6px;
  padding-bottom: 1em;
}

.sub02_1 #sect2 .col-lg-8 .col-6 .sub-text {
  font-size: 1rem;
  line-height: 1.4;
  letter-spacing: -.7px;
}

.sub02_1 #sect2 .bx-navy {
  background-color: #00234f;
  color: #fff;
}

.sub02_1 #sect2 .bx-white {
  background-color: #ffffff;
  color: #00234f;
}

.sub02_1 #sect2-1 .text {
  font-size: 1.2rem;
  text-align: center;
  line-height: 1.7;
}

.sub02_1 #sect2-1 .btn-more {
  display: inline-block;
  background-color: #012350;
  color: #fff;
  font-weight: bold;
  padding: .3em 2em;
}

.sub02_1 .row.progress:before {
  height: calc(100% + 11vh + 6.5rem);
}

/*.sub02_1 #sect3 .row{padding: 10vh 8vw;}*/

/* 문재인의 한반도 정책 - 02. 문재인의 한반도 정책 */
.sub02_2 {
  font-size: 1rem;
}

.sub02_2 .page-head {}

.sub02_2 .page-head h2 {
  color: #fff;
  font-size: 2.8rem;
  line-height: 1;
}

.sub02_2 section {
  padding: 6.5vh 0;
}

.sub02_2 h3 {
    font-size: 3rem;
    color: #00234f;
    font-weight: 700;
    text-align: center;
    display: table;
    margin: 0 auto 4rem;
    border-bottom: 3px solid #00234f;
}

.sub02_2 .sect-goal .title-text {
  padding-bottom: 1.5rem;
}

.sub02_2 .sect-goal .title-text h4 {
  font-size: 1.5rem;
  color: #012350;
  padding-bottom: .5em;
}

.sub02_2 .sect-goal .title-text p {
  font-size: 1.2rem;
  color: #012350;
}

.sub02_2 .sect-goal img.lines {
  position: absolute;
  top: 0;
  left: 15px;
  transition: all .5s ease;
}

.sub02_2 .sect-goal img.lines.hovered {
  transform: scale(1.1);
}

.sub02_2 .sect-goal .map-hover {
  padding: 1rem 0;
  font-size: 1.1rem;
}

.sub02_2 .sect-goal .map-hover h5 {
  font-size: 1.5rem;
}

.sub02_2 .sect-strategy .col-12 {
  margin-bottom: 3rem;
}

.sub02_2 .sect-strategy .wrap {
  /* width: 50%; */
  /* height: 100%; */
  position: relative;
  padding: 1.5rem 2rem 1rem;
  border-radius: 20px;
}

.sub02_2 .sect-strategy .wrap h4 {
  font-size: 1.4rem;
  font-weight: bold;
  padding-bottom: .5em;
}

.sub02_2 .sect-strategy .wrap .date {
  font-weight: 500;
  font-size: .9rem;
  padding-top: 1em;
}

.sub02_2 .sect-strategy .wrap:after {
  content: '';
  width: 0;
  height: 0;
  border: 25px solid transparent;
  position: absolute;
}

.sub02_2 .sect-strategy .num {
  position: absolute;
  font-size: 9rem;
  line-height: 1;
  font-weight: 900;
  color: rgba(0, 35, 79, .2);
  bottom: 0;
  right: 0;
  z-index: 1;
}

.sub02_2 .sect-strategy .col-6 {
  margin-bottom: 5rem;
}

.sub02_2 .sect-strategy .white .wrap {
  background-color: #fff;
}

.sub02_2 .sect-strategy .grey .wrap {
  background-color: #e6e6e6;
}


.sub02_2 .sect-strategy .navy .wrap {
  background-color: #012350;
  color: #fff;
  font-weight: 300;
}

.sub02_2 .sect-strategy .white + .navy .wrap:after {
  border-right-color: #012350;
  right: 100%;
  top: 50%;
  margin-top: -25px;
}

.sub02_2 .sect-strategy .grey + .navy .wrap:after {
  border-left-color: #012350;
  left: 100%;
  top: 50%;
  margin-top: -25px;
}


.sub02_2 .sect-strategy .white:before {
  bottom: -2.5rem;
  margin-bottom: -11px;
}

.sub02_2 .sect-strategy .grey:before {
  top: -2.5rem;
  margin-top: -6px;
}

.sub02_2 .sect-strategy dd {
  font-size: 1.1rem;
}

.sub02_2 .sect-rule h3 {
  margin-left: 100px;
}

/* 문재인의 한반도 정책 - 03. 판문점 선언*/
.sub02_3 {
  font-size: 1rem;
}

.sub02_3 .wrap-video {
  padding-bottom: 60%
}

.sub02_3 .page-body {
  padding-bottom: 0;
}

.sub02_3 .sect-intro {
  position: relative;
  /*  height: 84vh;*/
}

.sub02_3 .sect-intro .container {
/*
  padding-left: 20px;
  padding-right: 20px;
  max-width: 1160px;
*/
  position: relative;
  /*top: -40vh*/
}

.sub02_3 .sect-intro .row {
  margin-left: -20px;
  margin-right: -20px;
  padding-top: 7vh
}

.sub02_3 .sect-intro .col-4 {
  padding-left: 20px;
  padding-right: 20px;
}

.sub02_3 .sect-intro .col-4 .wrap {
  background-color: #fff;
  height: 100%;
}

.sub02_3 .sect-intro .col-4 .wrap p {
  padding: 1em;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.4
}

/*.sub02_3 .sect-intro p.text-center{font-size: 1.5rem; padding-top: 2.5em;}*/
.sub02_3 .sect-intro .title-text h3 {
  font-size: 3rem;
  padding-bottom: 1em;
}

.sub02_3 .sect-intro .title-text {
  font-size: 2rem;
}

.sub02_3 .sect-columns {
  padding: 10vh 8.5% 10vh;
}

.sub02_3 .sect-columns .row.no-gutters {
  margin-bottom: 2rem;
}

.sub02_3 .sect-columns .col-6.bg-grey {
  font-size: 1.2rem;
  padding: 2rem;
  min-height: 180px;
}

.sub02_3 .sect-columns .col-6:first-child {
  background-size: cover;
  background-position: center;
}

.sub02_3 .sect-columns dl {
  margin-top: -.8rem;
}

.sub02_3 .sect-columns dd {
  line-height: 1;
}

.sub02_3 .sect-columns dd .bold {
  margin-right: .3em;
}

.sub02_3 .sect-columns dd:before {
  display: none;
}

.sub02_3 .top-text {
  font-size: 1.5rem;
  /*padding-left: 8.5%;*/
  padding-top: 10vh;
}

.sub02_3 .bottom-text {
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  padding-bottom: 10vh;
}

/* 문재인의 한반도 정책 - 04. 문재인의 평화 어록 */
.sub02_4 .page-head {
  background-size: cover;
  background-position: center;
}

.sub02_4 .page-head .title-text {
  width: 100%;
  color: #fff;
  padding: 20vh 0;
}

.sub02_4 .page-head .title-text h2 {
  font-size: 4rem;
  line-height: 1.2;
  font-weight: 700;
  padding-bottom: .6em;
}

.talks {
  padding-top: 10vh;
}

.talks.type2 > .row {
  margin-bottom: 10vh;
}

.talks .row .txt {
  border-radius: 20px;
  border-bottom-left-radius: 0;
  font-size: 1.1rem;
  position: relative;
  padding: 2em 3em;
}

.talks .row.reverse .txt {
  padding: 1.5em;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 0;
  font-size: 1rem;
}

.talks .row .txt:after {
  content: '';
  width: 48px;
  height: 20px;
  display: block;
  position: absolute;
  top: 100%;
  left: -13px;
  background-image: url(/images/sub/talk-tail.gif);
  background-size: 100% auto;
}

.talks .row:nth-child(even) .txt:after {
  background-position: 0 50%
}

.talks .row.grey .txt:after {
  background-position: 0 100% !important;
}

.talks .row.reverse .txt:after {
  left: auto;
  right: -13px;
  background-image: url(/images/sub/talk-tail-reverse.gif)
}

.talks .row:nth-child(odd) .txt {
  background-color: #012350;
  color: #fff;
}

.talks .row:nth-child(even) .txt {
  background-color: #888888;
  color: #fff;
}

.talks .row.grey .txt {
  background-color: #efefef !important;
  color: #012350 !important;
}

.talks .date {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -1.9px;
  color: #c1c1c1;
}

.talks .date + p {
  font-size: 1rem;
  font-weight: 700;
  color: #012350;
}

.talks .col-lg-2 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%;
}

.talks .col-lg-9 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 71%;
  flex: 0 0 71%;
  max-width: 71%;
}

@media all and (min-width: 1400px) {
  .container.container1400,
  .page-head .container{
    max-width: 1400px;
  }
  
}

@media all and (max-width: 1730px) {}

@media all and (max-width: 1400px) {}

@media all and (max-width: 1199px) {


  .sub02_1 #sect2 .bx-grey .text {
    padding: 30px 20px;
  }

  .sub02_1 #sect2 .col-lg-8 .col-6 {
    height: 250px;
    padding: 30px 20px;
  }

  .sub02_1 #sect2 .col-lg-8 .col-6 .text {
    font-size: 1.5rem;
  }

  .sub02_1 #sect2 .col-lg-8 .col-6 .sub-text {
    font-size: 1rem;
  }

}

@media all and (max-width: 991px) {}

@media all and (max-width: 767px) {

  .list-title {
    padding-bottom: 3vh;
  }

  .list-title h3 {
    font-size: 1.1rem;
  }

  dd {
    font-size: 1.2rem;
  }

  .row.progress:before {
    left: 20px;
    height: calc(100% + 6vh + 7.5rem);
  }

  .row.progress .item {
    padding-left: 50px;
  }

  .row.progress .item:before {
    width: 30px;
    height: 30px;
    font-size: 15px;
    line-height: 30px;
    left: 5px;
    margin-top: -10px;
  }

  .row.progress dl {
    margin-left: -10px;
  }

  .row.progress .item > p {
    font-size: 1.2rem;
  }

  /*
  .row.progress p {
    font-size: 1rem;
  }
*/


  .sub02_2 .sect-goal img.lines {
    left: 5px;
  }

  .sub02_2 .sect-rule h3 {
    margin: 0 auto 3rem;
    padding-bottom:0;
  }

  .title-text2.text-lg-center h4,
  .title-text2.text-center h4 {
    font-size: 1.5rem;
  }

  .title-text2.text-lg-center,
  .title-text2.text-center {
    padding-top: 2rem;
  }

  .title-text2.text-lg-center p,
  .title-text2.text-center p {
    font-size: 1.3rem !important;
  }

  #content:not(.main) {
    padding-top: 20px;
  }

  .page-head {
    height: 30vh;
  }

  .sub02_1 section {
    padding: 6vh 0;
  }

  .sub02_1 #sect0 .row .bx-text .main-text {
    font-size: 1.4rem;
    color: #00234f;
  }

  .sub02_1 #sect0 .row .bx-text .sub-text {
    font-size: 1.1rem;
  }

  .sub02_1 #sect0 .row .link-to-video {
    width: 54px;
    height: auto;
  }

  .sub02_1 #sect1 .title {
    padding-bottom: 5vh;
  }

  .sub02_1 #sect1 .title h3 {
    font-size: 2.3rem;
  }

  .sub02_1 #sect2 .col-lg-8 .col-6 {
    height: auto;
  }

  .sub02_1 #sect0 .title h3 {
    font-size: 2.2rem;
  }

  .sub02_2 section {
    padding: 6vh 0;
  }

  .sub02_2 h3 {
    font-size: 2.8rem;
    padding-bottom: 2rem;
  }

  .sub02_2 .sect-strategy .col-12 {
    margin-bottom: 1rem;
  }

  .sub02_2 .sect-strategy .col-12.navy {
    margin-bottom: 5rem;
  }

  .sub02_2 .sect-strategy .wrap {
    width: 100%;
    font-size: 1.2rem;
  }

  .sub02_2 .sect-strategy .wrap:after {
    display: none;
  }

  .sub02_2 .sect-goal .title-text h4 {
    font-size: 1.7rem;
  }

  .sub02_1 #sect1 .title {
    padding-left: 0;
    text-align: center;
  }

  .sub02_3 .page-head {
    padding: 0;
    background-image: url(/images/sub/sub02_03_top_mobile.png);
    height: 0;
    padding-bottom: 107%;
    position: relative;
  }

  .sub02_3 .page-head h2 {
    position: absolute;
    top: 1em;
    left: 0;
    width: 100%;
    line-height: 1.2;
  }

  .talks .col-12:nth-child(1) p {
    display: inline-block;
  }

  .talks .row .txt,
  .talks .row.reverse .txt {
    padding: 1.2em;
    font-size: 1.2rem;
  }

  .talks .date,
  .talks .date + p {
    font-size: 1.5rem;
    padding-left: 10px;
    line-height: 1.2;
  }

  .sub02_2 .talks .date,
  .sub02_2 .talks .date + p {
    font-size: 1rem;
    display: inline-block !important;
    padding-top: 8px;
  }

  .talks .date + p {
    margin-bottom: 10px;
  }

  .talks .col-lg-2,
  .talks .col-lg-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .talks .row .txt:after {
    width: 20px;
    height: 8px;
    left: -5px;
  }

  .talks .row.reverse .txt:after {
    left: auto;
    right: -5px;
  }

}

@media all and (max-width: 575px) {
  /*
  .sub02_2 .sect-strategy .col-4 {
    padding: 5px;
  }
*/
}