@charset "UTF-8";

/* [S] 추진중점 및 과제 */
.assignment-wrap{margin-bottom: -3.2rem;}
.assignment-wrap img{width: 100%;}
.assignment-title{background: url(../../images/sub/bg-assignment.jpg) no-repeat center center / cover; padding: 5.1rem 1rem 5.6rem; border-radius: .6rem;}
.assignment-title h1{text-align: center; font-size: 2.8rem; color: #ffffff; font-family: pbGov;}
.assignment-list {margin-top: 2.4rem;}
.assignment-list ul{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4rem;}
.assignment-list li{width: 10rem; height: 10rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: .1rem solid #0089ca; background-color: rgba(0,0,0,.6);}
.assignment-list li p{font-size: 1.7rem; color: #3ec4ff; font-family: pmGov; line-height: 2rem; text-align: center; padding: 0 1rem;} 

.assignment-main-title{background-color: #005594; border-radius: 1.2rem; padding: 3.8rem 1rem;}
.assignment-main-title h1{text-align: center; font-size: 1.9rem; line-height: 2.6rem; color: white;}
.assignment-main-title h1 span{font-family: pbGov;}
.assignment-main-content{margin-top: 6.4rem;}
.assignment-main-content .assignment-main-box{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; margin-bottom: 3.2rem;}
.assignment-main-content .assignment-main-box:last-child{margin-bottom: 0;}
.assignment-main-content .assignment-chapter{width: 32.5rem; padding-right: 3.5rem; position: relative; }
.assignment-main-content .assignment-chapter::after{content:""; display: block; position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); width: 1.5rem; height: .5rem; background: url(../../images/sub/ic-assignment-dots.png) no-repeat center center / cover;}
.assignment-main-content .assignment-chapter p{border: .2rem solid #246beb; border-radius: 1.2rem; text-align: center; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 2.1rem; color: #246beb; font-family: pbGov;}
.assignment-main-content .assignment-chapter .num{position: absolute; left: 0; top: 0; width: 3rem; height: 3rem; background-color: #246beb; border-bottom-right-radius: 1.2rem; border-top-left-radius: 1.2rem; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #ffffff; font-family: pbGov;}
.assignment-main-content .assignment-chapter-content{width: calc(100% - 32.5rem); background-color: #eef2f7; border-radius: 1.2rem; padding: 2.8rem 1rem 2.8rem 3.2rem}
.assignment-main-content .assignment-chapter-box{margin-bottom: 1.6rem;}
.assignment-main-content .assignment-chapter-box:last-child{margin-bottom: 0;}
.assignment-main-content .assignment-chapter-box h1{font-size: 1.9rem; line-height: 2.5rem; color: #212121; font-family: pbGov;}
.assignment-main-content .assignment-chapter-list{margin-top: .7rem;}
.assignment-main-content .assignment-chapter-box li{padding-left: 1.7rem; position: relative; font-size: 1.7rem; color: #555555;}
.assignment-main-content .assignment-chapter-box li::before{content:""; display: block; position: absolute; left: 0; top: .8rem; width: .6rem; height: .6rem; background-color: #717171;}


@media screen and (max-width: 768px) {
  .assignment-title{padding: 3rem 1rem 3.6rem;}
  .assignment-title h1{font-size: 2.4rem;}
  .assignment-list{margin-top: 1.5rem;}
  .assignment-list ul{gap: 2rem;}
  .assignment-list li p{font-size: 1.5rem; line-height: 1.7rem;}

  .assignment-main-title{padding: 2.5rem 1rem;}
  .assignment-main-title h1{font-size: 1.6rem; line-height: 2.3rem;}
  .assignment-main-content{margin-top: 4rem;}
  .assignment-main-content .assignment-main-box{flex-direction: column;}
  .assignment-main-content .assignment-chapter{width: 100%; padding-right: 0; padding-bottom: 3.5rem;}
  .assignment-main-content .assignment-chapter::after{top: auto; bottom: 1rem; right: 50%; transform: translateX(50%) rotate(90deg);}
  .assignment-main-content .assignment-chapter p{padding: 2rem 1rem; font-size: 1.9rem;}
  .assignment-main-content .assignment-chapter-content{width: 100%; padding: 2rem 1rem 2rem 2rem;}
  .assignment-main-content .assignment-chapter-box h1{font-size: 1.7rem;}
  .assignment-main-content .assignment-chapter-box li{font-size: 1.5rem;}
}
/* [E] 추진중점 및 과제 */

/* [S] 한미 동맹 개관 */
.rokus-wrap{background-color: #eef2f7; border-radius: 1.2rem; padding: 3.2rem; display: flex; flex-wrap: wrap; justify-content: space-between;}
.rokus-wrap .rokus-image{width: 31.5rem; position: relative; height: 0; padding-bottom: 21rem;}
.rokus-wrap .rokus-image img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.rokus-wrap .rokus-content{width: calc(100% - 34.7rem);}
.rokus-wrap .rokus-content h1{font-size: 1.9rem; color: #063a74; font-family: pbGov;}
.rokus-wrap .rokus-content p{font-size: 1.7rem; line-height: 3rem; color: #555555; margin-top: .6rem;}

@media screen and (max-width: 768px) {
  .rokus-wrap{flex-direction: column; padding: 2rem;}
  .rokus-wrap .rokus-image{width: 100%; padding-bottom: 56.25%;}
  .rokus-wrap .rokus-content{width: 100%; margin-top: 2rem;}
  .rokus-wrap .rokus-content h1{font-size: 1.7rem}
  .rokus-wrap .rokus-content p{Font-size: 1.5rem; line-height: 2.6rem}
}
/* [E] 한미 동맹 개관 */

/* [S] 국정성과 홍보자료 */
.sub-card-list-wrap{margin-top: 4rem;}
.sub-card-list-wrap > ul{display: flex; flex-wrap: wrap; margin: -2.5rem -1.25rem 0; align-items: stretch;}
.sub-card-list-wrap > ul > li{width: calc(100%/3); padding: 0 1.25rem; margin-top: 2.5rem;}
.sub-card-list-wrap > ul > li .sub-card-list-box{position: relative; height: 100%;}
.sub-card-list-wrap > ul > li .sub-card-list-box::after{content:""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: .5rem; border: .1rem solid #e2e2e2; z-index: -1;}
.sub-card-list-wrap > ul > li .sub-card-list-title{padding: 2rem 2rem 1.6rem;}
.sub-card-list-wrap > ul > li .sub-card-list-title span{display: block; font-size: 1.5rem; font-family: plGov; color: white; background-color: #003675; border-radius: .5rem; width: 12.8rem; text-align: center; line-height: 2.5rem;}
.sub-card-list-wrap > ul > li .sub-card-list-title h1{font-size: 1.9rem; line-height: 2.6rem; font-family: psbGov; color: #555555; min-height: 5.2rem; margin-top: 1.2rem;}
.sub-card-list-wrap > ul > li .sub-card-list-image{padding-bottom: 35.4rem; position: relative;}
.sub-card-list-wrap > ul > li .sub-card-list-image img{position: absolute; left: .1rem; top: 0; width: calc(100% - .2rem); height: 100%; object-fit: cover;}
.sub-card-list-wrap > ul > li .sub-card-list-link{padding: 2rem 1.3rem;}
.sub-card-list-wrap > ul > li .sub-card-list-link ul{display: flex; flex-wrap: wrap; margin-top: -.5rem; justify-content: space-between;}
.sub-card-list-wrap > ul > li .sub-card-list-link li{margin-top: .5rem; width: 48%;}
.sub-card-list-wrap > ul > li .sub-card-list-link .small-btn{display: block; padding-right: 4rem;}
.sub-card-list-wrap > ul > li .sub-card-list-link .small-btn.btn1{background-image: url(/sites/guide/images/guide/common/btn-link1-2.png)}
.sub-card-list-wrap > ul > li .sub-card-list-link .small-btn.btn1:hover{background-image: url(/sites/guide/images/guide/common/btn-link1-on.png)}

@media screen and (max-width: 768px){
  .sub-card-list-wrap > ul > li{width: 100%;}
  .sub-card-list-wrap > ul > li .sub-card-list-link ul{justify-content: start;}
  .sub-card-list-wrap > ul > li .sub-card-list-link li{margin-right: .5rem;}
  .sub-card-list-wrap > ul > li .sub-card-list-image img{object-fit: contain;}
}


.flex{display: flex; justify-content: space-between;}

@media screen and (max-width: 768px) {
  .flex{flex-direction: column;}
  .flex .left,
  .flex .right{width: 100% !important;}
}
/* [E] 국정성과 홍보자료 */

/* [S] 국가 비전ㆍ목표 */
.vision-image{margin-bottom: 5rem;}
.vision-image .vision-image-title{background-color: #256ef4; padding: 2rem 0; border-radius: 1rem; margin-bottom: 3rem;}
.vision-image .vision-image-title h1{text-align: center; font-size: 2.7rem; color: #ffffff; font-family: pb;}
.vision-image .vision-image-contet{border: .1rem solid #ced3d6; border-radius: 1rem; padding: 5rem 3rem; position: relative;}
.vision-image .vision-line1,
.vision-image .vision-line2,
.vision-image .vision-line3{display: flex; flex-wrap: wrap;}
.vision-image .vision-line2{padding: 0 10rem; margin: -4rem 0 2.5rem;}
.vision-image .center{justify-content: center;}
.vision-image .space{justify-content: space-between;}
.vision-image .vision-image-box{width: 14rem; height: 14rem; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.vision-image .vision-image-box h1{text-align: center; font-size: 1.7rem; line-height: 2.4rem; color: #ffffff;}
.vision-image .c1{background-color: #002bac}
.vision-image .c2{background-color: #004cd3}
.vision-image .c3{background-color: #0061ee}
.vision-image .c4{background-color: #0061a6}
.vision-image .c5{background-color: #0077c4}
.vision-image .vision-image-subtitle{background: url(../../images/sub/vision-image-bg.png) no-repeat center center / contain; width: 52.4rem; height: 22rem; position: absolute; left: 50%; margin-left: -26.2rem; bottom: 7rem; display: flex; align-items: end; justify-content: center;}
.vision-image .vision-image-subtitle h1{font-size: 3.2rem; color: #174eb9; font-family: pb; text-align: center; padding-bottom: 3rem;}

@media screen and (max-width: 1300px) {
	.vision-image .vision-image-contet{padding: 3rem 1.5rem;}
	.vision-image .vision-image-subtitle{position: static; width: 70%; background: none; height: 6rem; margin: 0 auto; border-radius: 10rem; background-color: #174eb9; align-items: center; margin-bottom: 3rem;}
	.vision-image .vision-image-subtitle h1{color: white; padding-bottom: 0; font-size: 2.5rem;}
}

@media screen and (max-width: 768px) {
	.vision-image .vision-line1,
	.vision-image .vision-line2,
	.vision-image .vision-line3{flex-direction: column; margin-bottom: 1rem; gap: 1rem;}
	.vision-image .vision-line2{margin: 0; padding: 0;}
	.vision-image .center,
	.vision-image .space{justify-content: start; align-items: center;}
}
/* [E] 국가 비전ㆍ목표 */

/* [S] 국정과제 */
.project-title{background: #256ef4; border-radius: 1rem; padding: 2rem 0; position: relative; margin-bottom: 3rem;}
.project-title::after{content:""; display: block; position: absolute; right: 2rem; top: 50%; margin-top: -2.95rem; width: 13.8rem; height: 5.9rem; background: url(../../images/sub/project-bg.png) no-repeat center center;}
.project-title h1{text-align: center; font-size: 2.7rem; color: #ffffff; font-family: pb;}
.project-content li{position: relative; border: .2rem solid #246beb; border-radius: 1rem; font-size: 1.9rem; color: #246beb; font-family: pb; padding: 1.4rem 2rem 1.4rem 6rem; margin-bottom: 1rem;}
.project-content li:last-child{margin-bottom: 0;}
.project-content li span{border-radius: 1rem; background-color: #246beb; width: 3rem; height: 3rem; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0; color: white; font-size: 1.5rem; border-top-left-radius: .5rem; border-top-right-radius: 0; border-bottom-left-radius: 0;}

@media screen and (max-width: 768px){
	.project-title{padding: 1rem 0;}
	.project-title h1{font-size: 2rem;}
	.project-content li{font-size: 1.6rem; padding: 1rem 1.5rem 1rem 5rem}
}
/* [E] 국정과제 */