@charset "utf-8";

@media (max-width: 1600px) {
	/* s201 */
	.s201 .slick-arrow {bottom: calc((100% - 124px - 60px)/2); width: 60px; height: 60px;}
	.s201 .slick-prev {left: 10px;}
	.s201 .slick-next {right: 10px;}
	.s201 .slick-prev:hover {background-position: left 18px center;}
	.s201 .slick-next:hover {background-position: right 18px center;}
}

@media (max-width: 1400px) {
	/* s102 */
	.s102 .history:before {left: 630px;}
	.s102 .history .title {max-width: 630px;}

	/* s201 */
	.s201 .slick-dots:before {top: 110px;}
	.s201 .slick-dots li button {width: 220px; height: 220px;}
}

@media (max-width: 1200px) {
	/* s101 */
	.s101 .arti02 ul li .inner {padding: 80px 40px 85px;}

	/* s102 */
	.s102 .history:before {left: 500px;}
	.s102 .history .title {max-width: 500px; padding-right: 60px;}
	.s102 .history .title p {font-size: 100px;}
	.s102 .history .description .year-wrap {padding-left: 70px;}
	.s102 .history .description .year-wrap:after {width: 50px;}
}

@media (max-width: 1024px) {
	.sub-visual {height: 400px; margin-top:80px; margin-bottom: 100px;}
	.sub-visual .title {height: calc(100% - 65px);}
	.sub-visual05 .title, .sub-visual06 .title {height: 100%;}
	.sub-visual .title p {font-size: 55px;}

	.lnb ul li a {height: 65px;	font-size: 18px;}

	.page-title {margin-bottom: 50px;}
	.page-title h2 {font-size: 46px; padding-top: 16px;}
	.page-title h2:before {width: 30px;}

	.arti-title {margin-bottom: 50px;}
	.arti-title h3 {font-size: 40px; padding-top: 16px;}

	.real-cont {padding: 0 0 130px;}
	.sub-content {padding: 0 0 130px;}
	
	/* s101 */
	.s101 .arti01 {padding-bottom: 100px;}
	.s101 .arti01 .text-box {display: block; margin-bottom: 60px;}
	.s101 .arti01 .text-box .left {max-width: none;}
	.s101 .arti01 .text-box .left b {font-size: 16px; margin-bottom: 20px;}
	.s101 .arti01 .text-box .left h3 {font-size: 34px; margin-bottom: 30px;}
	.s101 .arti01 .text-box .sig {display: none;}
	.s101 .arti01 .text-box .right {width: 100%; flex: auto; padding-left: 0; margin-top: 0;}
	.s101 .arti01 .text-box .right:before {display: none;}
	.s101 .arti01 .text-box .right p {font-size: 16px;}
	.s101 .arti01 .text-box .right p:not(:last-child) {margin-bottom: 20px;}
	.s101 .arti01 .text-box .right p.mb-0 {margin-bottom: 20px;}
	.s101 .arti01 .text-box .sig.mob-only {display: block; font-size: 20px; font-weight: 500; line-height: 1.4em; color: #444;}
	.s101 .arti01 .text-box .sig.mob-only span {font-weight: 600; color: #010101; margin-left: 14px;}
	.s101 .arti01 .img-box {height: 350px;} 
	.s101 .arti02 {padding: 100px 0 130px;}
	.s101 .arti02 ul {margin: 0 -10px;}
	.s101 .arti02 ul li {width: 33.3333%;padding: 0 10px;}
	.s101 .arti02 ul li .inner {padding: 50px 20px;}
	.s101 .arti02 ul li .icon {margin-bottom: 25px;}
	.s101 .arti02 ul li .icon img {width: 120px;}
	.s101 .arti02 ul li h4 {font-size: 22px; margin-bottom: 12px;}
	.s101 .arti02 ul li p {font-size: 16px;}

	/* s102 */
	.s102 .history {padding-bottom: 130px;}
	.s102 .history:before {left: 330px;}
	.s102 .history .title {max-width: 330px; padding-right: 40px;}
	.s102 .history .title h3 {font-size: 30px; margin-bottom: 5px;}
	.s102 .history .title p {font-size: 60px; margin-bottom: 35px;}
	.s102 .history .description .year-wrap {padding-left: 50px;}
	.s102 .history .description .year-wrap:not(:last-child) {margin-bottom: 60px;}
	.s102 .history .description .year-wrap:before {top: 9px;}
	.s102 .history .description .year-wrap:after {top: 17px; width: 35px;}
	.s102 .history .description .year h4 {font-size: 38px; margin-bottom: 20px;}
	.s102 .history .description ul li {font-size: 16px; padding-left: 8px;}
	.s102 .history .description ul li:before {top: 12px;}

	/* s105 */
	.s105 .map {margin-bottom: 30px;}
	.s105 .map .root_daum_roughmap {width:100% !important; height:360px !important;}
	.s105 .map .root_daum_roughmap .wrap_map {height:360px !important;}
	.s105 .info dl {font-size: 20px;}
	.s105 .info dt {max-width: 60px;}
	.s105 .btn-wrap a {width: 50px; height: 50px;} 

	/* s201 */
	.s201 .slick-dots {margin-bottom: 80px;}
	.s201 .slick-dots:before {top: 80px; width: calc(100% - 100px);}
	.s201 .slick-dots li {}
	.s201 .slick-dots li button {width: 160px; height: 160px;}
	.s201 .slick-dots li button p {font-size: 16px; margin-bottom: 3px;}
	.s201 .slick-dots li button h3 {font-size: 24px;}
	.s201 .slick-dots li.slick-active button {border: 8px solid #f4cdcf;}
	.s201 .slick-dots li .dot-desc {font-size: 15px; margin: 20px auto 0;}
	.s201 .slide .item .text {margin-bottom: 40px;}
	.s201 .slide .item .text h3 {width: 150px; line-height: 56px; font-size: 22px;}
	.s201 .slick-arrow {bottom: calc((100% - 96px - 40px)/2); width: 60px; height: 60px;} 

	/* s202 */
	.img-list {margin: -25px -10px;}
	.img-list li {width: 33.3333%; padding: 25px 10px;}
	.img-list li img {margin-bottom: 20px;}
	.img-list li figcaption {font-size: 22px;}

	/* s601 */
	.s601 .arti01 .wrap > div {width: 50%; min-height: 500px;}
	.s601 .arti01 .text {padding: 10px;}
	.s601 .arti01 .text figure {margin-bottom: 25px;}
	.s601 .arti01 .text p {font-size: 26px; margin-bottom: 4px;}
	.s601 .arti01 .text b {font-size: 32px; margin-bottom: 30px;}
	.s601 .arti01 .text a {width: 280px; line-height: 65px; font-size: 18px; padding: 0 30px;}  
	.s601 .arti01 .text a:after {right: 30px;}
}

@media (max-width: 768px) {
	.sub-visual {height: 350px; margin-top:60px; margin-bottom: 80px;}
	.sub-visual .title {height: calc(100% - 55px);}
	.sub-visual05 .title, .sub-visual06 .title {height: 100%;}
	.sub-visual .title p {font-size: 40px;}

	.lnb ul li a {height: 55px;	font-size: 16px;}

	.page-title {margin-bottom: 40px;}
	.page-title h2 {font-size: 32px; padding-top: 14px;}
	.page-title h2:before {width: 26px;}

	.arti-title {margin-bottom: 40px;}
	.arti-title h3 {font-size: 30px; padding-top: 14px;}

	.real-cont {padding: 0 0 100px;}
	.sub-content {padding: 0 0 100px;}

	/* s101 */
	.s101 .arti01 {padding-bottom: 70px;}
	.s101 .arti01 .text-box {margin-bottom: 50px;}
	.s101 .arti01 .text-box .left b {margin-bottom: 15px;}
	.s101 .arti01 .text-box .left h3 {font-size: 28px; margin-bottom: 25px;}
	.s101 .arti01 .text-box .right p {font-size: 16px;}
	.s101 .arti01 .text-box .right p:not(:last-child) {margin-bottom: 20px;}
	.s101 .arti01 .text-box .sig.mob-only {font-size: 18px;}
	.s101 .arti01 .text-box .sig.mob-only span {margin-left: 10px;}
	.s101 .arti01 .img-box {height: 250px;} 

	.s101 .arti02 {padding: 70px 0 100px;}
	.s101 .arti02 ul {flex-wrap: wrap; margin: -10px;}
	.s101 .arti02 ul li {width: 100%; padding: 10px;}
	.s101 .arti02 ul li .inner {padding: 30px 20px;}
	.s101 .arti02 ul li .icon {margin-bottom: 20px;}
	.s101 .arti02 ul li .icon img {width: 100px;}
	.s101 .arti02 ul li h4 {font-size: 20px; margin-bottom: 10px;}
	.s101 .arti02 ul li p {font-size: 16px;}

	/* s102 */
	#wrapper.s12 {overflow: hidden;}
	.s102 .history {display: block; padding-bottom: 100px;}
	.s102 .history .contain {overflow: hidden;}
	.s102 .history:before {display: none;}
	.s102 .history .title {position: relative; top: auto; max-width: none; padding-right: 0; margin-bottom: 50px;}
	.s102 .history .title h3 {font-size: 26px; margin-bottom: 5px;}
	.s102 .history .title p {font-size: 55px; margin-bottom: 25px;}
	.s102 .history .description {position: relative;}
	.s102 .history .description:before {position: absolute; top: 12px; left: 8px; content: ''; width: 1px; height: calc(100% + 100px); background: #c60610; z-index: 5;} 
	.s102 .history .description .year-wrap {padding-left: 50px;}
	.s102 .history .description .year-wrap:not(:last-child) {margin-bottom: 40px;}
	.s102 .history .description .year-wrap:before {top: 6px; left: 0;}
	.s102 .history .description .year-wrap:after {top: 14px; width: 35px;}
	.s102 .history .description .year h4 {font-size: 32px; margin-bottom: 15px;}
	.s102 .history .description ul li {font-size: 16px; padding-left: 8px;}
	.s102 .history .description ul li:before {top: 12px;}

	/* s105 */
	.s105 .map {margin-bottom: 20px;}
	.s105 .map .root_daum_roughmap {height:260px !important;}
	.s105 .map .root_daum_roughmap .wrap_map {height:260px !important;}
	.s105 .info-wrap {display: block;}
	.s105 .info dl {font-size: 18px;}
	.s105 .info dt {max-width: 50px;}
	.s105 .btn-wrap {justify-content: flex-end; margin-top: 15px;}
	.s105 .btn-wrap a {width: 50px; height: 50px;} 

	/* s201 */
	.s201 .slick-dots {margin-bottom: 60px;}
	.s201 .slick-dots:before {top: 50px;}
	.s201 .slick-dots li {width: 25%;}
	.s201 .slick-dots li .dot-item {text-align: center;}
	.s201 .slick-dots li button {width: 100px; height: 100px;}
	.s201 .slick-dots li button p {font-size: 14px; margin-bottom: 0;}
	.s201 .slick-dots li button h3 {font-size: 18px;}
	.s201 .slick-dots li.slick-active button {border: 6px solid #f4cdcf;}
	.s201 .slick-dots li .dot-desc {font-size: 15px; margin: 20px auto 0;}
	.s201 .slide .item .text {margin-bottom: 30px;}
	.s201 .slide .item .text h3 {width: 130px; line-height: 50px; font-size: 18px;}
	.s201 .slick-arrow {bottom: calc((100% - 80px - 50px)/2); width: 50px; height: 50px;} 
	.s201 .slick-prev {left: 5px;}
	.s201 .slick-next {right: 5px;}
	.s201 .slick-prev:hover {background-position: left 14px center;}
	.s201 .slick-next:hover {background-position: right 14px center;}

	/* s202 */
	.img-list {margin: -20px -7px;}
	.img-list li {width: 50%; padding: 20px 7px;}
	.img-list li img {margin-bottom: 15px;}
	.img-list li figcaption {font-size: 18px;}

	/* s601 */
	.s601 .arti01 .wrap {display: block;}
	.s601 .arti01 .wrap > div {width: 100%; min-height: auto;}
	.s601 .arti01 .text {padding: 50px 10px;}
	.s601 .arti01 .text figure {margin-bottom: 25px;}
	.s601 .arti01 .text figure img {width: 140px;}
	.s601 .arti01 .text p {font-size: 22px; margin-bottom: 4px;}
	.s601 .arti01 .text b {font-size: 28px; line-height: 1.3em; margin-bottom: 25px;}
	.s601 .arti01 .text a {width: 260px; line-height: 55px; font-size: 16px; padding: 0 30px;}  
	.s601 .arti01 .text a:after {right: 30px;}
	.s601 .arti01 .img {align-content: center; border: 1px solid #ddd; border-top: 0; border-radius: 0 0 20px 20px;}
}

@media (max-width: 480px) {
	/* s201 */
	.s201.sub-content {padding-bottom: 155px;}
	.s201 .slick-dots  {margin-bottom: 20px;}
	.s201 .slick-dots:before {top: 40px;}
	.s201 .slick-dots li {width: 25%;}
	.s201 .slick-dots li button {width: 80px; height: 80px;}
	.s201 .slick-dots li button p {font-size: 13px; margin-bottom: 0;}
	.s201 .slick-dots li button h3 {font-size: 16px;}
	.s201 .slick-dots li .dot-desc {display: none;}
	.s201 .slide .dot-text {display: block; margin-bottom: 60px;}
	.s201 .slick-arrow {bottom: -55px; width: 45px; height: 45px;} 
	.s201 .slick-prev {left: 50%; margin-left: -50px;}
	.s201 .slick-next {left: calc(50% + 5px);}
}