@charset "utf-8";

/* 메인 제목 */
.main-title {padding-top: 10rem;text-align: center;}
.main-title strong {display: inline-block; font-family: sb; font-size: 6rem; line-height: 1; color: #000000;}
#menu405_obj1743 {width: 100% !important;z-index: 1 !important;}
#menu405_obj1865 {width: 100% !important;z-index: 1 !important;}

@media screen and (max-width: 1024px) {
 	.main-title {padding-top: 8rem;}
  	.main-title strong {font-size: 4.8rem;}
}

@media screen and (max-width: 768px) {
 	.main-title {padding-top: 6rem;}
    .main-title strong {font-size: 4rem;}
}

@media screen and (max-width: 650px) {
    .main-title.photo {padding: 6rem 8rem 0 2rem;}
  	.main-title.photo strong {display: block;text-align: left;}
}

/* 노틱스 */
.wrap-notice-test {padding: 10rem 0 6rem 0; background: url('../../images/main/bg-notice.jpg') no-repeat center top / cover;}
.wrap-notice-test .head {position: relative;}
.wrap-notice-test .head .title {position: absolute; left: 0; top: -.8rem; }
.wrap-notice-test .head .title strong {font-family: ppe; font-size: 6rem; line-height: 1; color: #fff;}
.wrap-notice-test .head .tab ul {display: flex; justify-content: center;}
.wrap-notice-test .head .tab li {position: relative; margin-right: 3.5rem; padding-right: 4.5rem;}
.wrap-notice-test .head .tab li::after {content: '/'; position: absolute; right: 0; top: 0; font-family: ppl; font-size: 3.5rem; line-height: 1.2; color: #91b4e2;}
.wrap-notice-test .head .tab li:last-child {margin-right: 0; padding-right: 0;}
.wrap-notice-test .head .tab li:last-child::after {display: none;}
.wrap-notice-test .head .tab button {font-family: ppr; font-size: 3.5rem; color: #91b4e2;}
.wrap-notice-test .head .tab button:hover,
.wrap-notice-test .head .tab .on button {font-family: ppe; color: #fff;}
.wrap-notice-test .head .tab button span {position: relative;}
.wrap-notice-test .head .tab button:hover span::after,
.wrap-notice-test .head .tab .on button span::after {content: ''; position: absolute; left: -2.4rem; top: -.7rem; width: 1.6rem; height: 1.7rem; background: url('../../images/main/ic-notice-tab.png') no-repeat center / cover;}
.wrap-notice-test .head .more {position: absolute; right: 0; top: 1rem; width: 3rem; height: 3rem; background: url('../../images/main/btn-notice-more.png') no-repeat center / cover; text-indent: -9999rem; transition: transform .35s;}
.wrap-notice-test .head .more:hover {transform: rotate(270deg);}
.wrap-notice-test .head .more > a {display: block;width: 100%;height: 100%;}
.wrap-notice-test .slider {margin-top: 8rem;}
.wrap-notice-test .slider ul {display: flex; flex-wrap: wrap; width: calc(100% + 4rem);}
.wrap-notice-test .slider li {width: 25%; padding-right: 4rem; padding-bottom: 4rem;}
.wrap-notice-test .slider .box {position: relative; display: block; height: 21rem; padding: 3.3rem 4rem; background: #fff; transition: .35s;}
.wrap-notice-test .slider .notice .box::after {content: ''; position: absolute; right: 2rem; bottom: 2rem; display: block; width: 4.8rem; height: 4.8rem; background: #0a356f url('../../images/main/ic-notice.png') no-repeat center; border-radius: 100%;}
.wrap-notice-test .slider .box:hover {background: #00aae5; border-radius: 0 5rem 0 0;}
.wrap-notice-test .slider .box .subject {display: block;font-family: pm; font-size: 2.2rem; color: #000000;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; }
.wrap-notice-test .slider .box:hover .subject {font-family: pb; color: #fff;}
.wrap-notice-test .slider .box .subject span {position: relative;}
.wrap-notice-test .slider .box .subject span::before {content: ''; position: absolute; bottom: 0; left: 0; height: 2px; width: 0; background: #fff;transition: .3s;}
.wrap-notice-test .slider .box:hover .subject span::before {width: 100%;}
.wrap-notice-test .slider .box .desc {display: -webkit-box; margin-top: 2rem; font-family: pr; font-size: 1.6rem; color: #6b6b6b;  overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.wrap-notice-test .slider .box:hover .desc {color: #fff;}
.wrap-notice-test .slider .box .date {display: block; margin-top: 2rem; font-family: pr; font-size: 1.3rem; color: #aaaaaa;}
.wrap-notice-test .slider .box:hover .date {color: #fff;}
.wrap-notice-test .swiper-pagination  {display: none;}

@media screen and (max-width:1600px) {
  	.wrap-notice-test {background-position: right;}
  	.wrap-notice-test .slider li {padding-right: 0;}
  	.wrap-notice-test .swiper-pagination {display: block;left: 50% !important;bottom: 5rem !important;transform: translateX(-50%) !important;}
	.wrap-notice-test .swiper-pagination > span {margin-right: 1rem !important;opacity: 1 !important;background: #90a3bd !important;}
	.wrap-notice-test .swiper-pagination > span:last-child {margin-right: 0 !important;}
	.wrap-notice-test .swiper-pagination > .swiper-pagination-bullet-active {width: 4rem !important;background: #00aae5 !important;border-radius: 0.5rem !important;}
}

@media screen and (max-width:1100px) {
	.wrap-notice-test {padding: 8.5rem 0 13rem 0;}
	.wrap-notice-test .head .tab ul {margin-right: 3rem;}
	.wrap-notice-test .head .tab li {margin-right: 2.5rem;}
	.wrap-notice-test .head .title strong {font-size: 4.8rem;}
	.wrap-notice-test .head .tab button {font-size: 2.8rem;}
	.wrap-notice-test .head .tab li::after {font-size: 2.8rem;}
	.wrap-notice-test .head .tab button:hover span::after,
	.wrap-notice-test .head .tab .on button span::after {background-size: 1.3rem;top: -.6rem;left: -2.2rem;}
	.wrap-notice-test .slider {margin-top: 5.2rem;}
	.wrap-notice-test .slider li {padding-bottom: 0;}
	.wrap-notice-test .head .more {width: 2.4rem;height: 2.4rem;;top: 0.5rem;}
  	.wrap-notice-test .swiper-pagination {bottom: 8rem !important;}
}

@media screen and (max-width:950px) {
	.wrap-notice-test .head .tab ul {margin-right: -10rem;}
}

@media screen and (max-width: 768px) {
	.wrap-notice-test {padding: 10rem 0 11rem 0;background-position: right -34rem top;}
  	.wrap-notice-test > .area {padding: 0 2rem;}
	.wrap-notice-test .head .title {top: -4rem;}
	.wrap-notice-test .head .title strong {font-size: 4rem;}
  	.wrap-notice-test .head .more {top: -3.5rem;}
	.wrap-notice-test .head .tab ul {transform: translate(2rem, 2.7rem);justify-content: flex-start;}
	.wrap-notice-test .swiper-pagination {bottom: 6rem !important;}
  	.wrap-notice-test .slider .box {height: auto;padding: 2.8rem 10rem 2.8rem 2rem;}
	.wrap-notice-test .slider .box .desc {margin-top: 1rem;}
	.wrap-notice-test .slider .box .date {margin-top: 1rem;}
}