@charset "utf-8";

@media (max-width: 1800px) {
	/* header */
	#gnb > ul > li {padding:0 10px; width: 150px;}
}

@media (max-width: 1600px) {
	/* header */
	#header .sitelogo a {width: 200px; margin-top:-23px; background-size: 200px auto;}
	#gnb > ul > li {width: 130px;}
	#gnb > ul > li > a {font-size:18px;}
	#gnb .submenu > ul > li > a {font-size:17px;}

	/* section02 */
	.section02 .section-title {max-width: 500px;}
	.section02 .items {left: 500px;}
	.section02 .bar {max-width: none; width: calc(100% - 500px);}

	/* section04 */
	.section04 .section-content {max-width: 380px;}
}

@media (max-width: 1500px) {
	/* section04*/
	.section04 {padding: 150px 0 100px;}
	.section04:after {bottom: none; top: 460px; margin-left: -200px;}
	.section04 .section-title {max-width: none;}
	.section04 .section-title .img-box {background-size: auto 680px;}
	.section04 .section-content {max-width: none; padding-top: 30px;}
	.section04 .section-content h4 br {display: none;}
	.section04 .section-content ul {display: flex; flex-wrap: wrap;} 
	.section04 .section-content ul li {width: auto; margin-right: 30px;}
}

@media (max-width: 1400px) {
	/* header */
	#header .sitelogo a {width: 180px; background-size: 180px auto;}
	#gnb > ul > li {width: 92px; padding: 0 5px;}
	#gnb .submenu > ul > li {padding:0 10px;}
}

@media (max-width: 1300px) {
	/* header */
	#gnb > ul > li > a {font-size:17px;}
	#gnb .submenu > ul > li {padding:0 5px;}
	#gnb .submenu > ul > li > a {font-size:16px; padding: 0 8px;}

	/* section02 */
	.section03 .section-content ul {margin: 0 -30px;}
	.section03 .section-content ul li {padding: 0 30px;}
}

@media (max-width: 1200px) {
	/* header */
	#header .sitelogo a {width: 150px; background-size: 150px auto; margin-top: -23px;}
	#gnb {display: none;}

	.lang-selector {right: 240px;}
	.mems {right: 60px;}
	.site-wrap .logo img {width: 150px;}
	.sitemap-btn {display: block;}

	#header.scrolled .sitemap-btn span:before, #header.scrolled .sitemap-btn span:after {background: #000;}
	#header.scrolled .sitemap-btn span {background: #000;}

	#header.hide {transform:translateY(0); background: #fff;}
	#header.hide .sitelogo a {background-image: url('../img/layout/logo-black.png');}
	#header.hide .mems ul li a {color: #333;}
	#header.hide .mems ul li:after {background: #333;}
	#header.hide .sitemap-btn span:before, #header.hide .sitemap-btn span:after {background: #000;}
	#header.hide .sitemap-btn span {background: #000;}
	#header.hide .lang-selector button {color: #333; border: 1px solid #333;}
	#header.hide .lang-selector button:after {filter: brightness(0);}
	#header.hide .lang-selector ul {border: 1px solid #333; background: rgba(255,255,255,0.8);}
	#header.hide .lang-selector ul li a {color: #333;}

	/* main-visual */
	.main-visual .content .text-box h2 {font-size: 52px;}

	/* section common */
	section {padding: 120px 0 130px;}
	.section-title small {font-size: 23px;}
	.section-title small.eng {font-size: 20px;} 
	.section-title h3 {font-size: 45px;}

	/* section01 */
	.section-content ul.col-4 {margin: 0 -10px;}
	.section-content ul.col-4 li {padding: 0 10px;}
	.section-content ul.col-4 li .text-box h4 {font-size: 24px; margin-bottom: 10px;}
	.section-content ul.col-4 li .text-box p {font-size: 17px;}

	/* section02 */
	.section02 .section-title {padding-bottom: 180px;}
	.section02 .items {width: 100%;}
	.section02 .item .text-box h4 {font-size: 26px;}
	.section02 .item .text-box p {font-size: 17px;}

	/* section03 */
	.section03 {padding: 120px 0 140px;}
	.section03 .section-content ul {margin: 0 -25px; padding: 0;}
	.section03 .section-content ul li {padding: 0 25px;}
	.section03 .section-content ul li .text-box h4 {font-size: 24px;} 
	.section03 .section-content ul li .text-box p {font-size: 17px;}

	/* section04*/
	.section04 {padding: 120px 0 80px;}
	.section04:after {background-size: 340px auto; top: 380px; margin-left: -160px;}
	.section04 .section-title .img-box {background-size: auto 600px;}
	.section04 .section-content {padding-top: 0;}
	.section04 .section-content h4 {font-size: 26px; margin-bottom: 30px;}
	.section04 .section-content h4 span {font-size: 45px;}
	.section04 .section-content ul li {font-size: 17px;}

	/* section06 */
	.section06 {padding: 120px 0 0;}
	.section06 .section-title p {font-size: 23px;}
	.section06 .item img {max-width: 400px;}

	/* section07 */
	.section07 {padding: 120px 0 130px;}
	.section07 .text-box {padding-right: 25px;}
	.section07 .info dt {width: 122px; font-size: 20px;}
	.section07 .info dd {font-size: 20px;}

	/* footer */
	#footer {padding: 70px 0 80px;}
}

@media (max-width: 1024px) {
	/* main-visual */
	.main-visual .content .wrap {height: calc(100% - 80px); margin-top: 80px;}
	.main-visual .content .wrap .items {margin-bottom: 60px;}
	.main-visual .content .text-box h2 {font-size: 42px; margin-bottom: 15px;}
	.main-visual .content .text-box p {font-size: 18px; margin-bottom: 25px;}
	.main-visual .content .text-box .more-btn {width: 150px; line-height: 45px;}

	/* section common */
	section {padding: 80px 0 90px;}
	.section-title small {font-size: 20px; margin-bottom: 10px;}
	.section-title small.eng {font-size: 18px;} 
	.section-title h3 {font-size: 36px;}
	.section-title p {font-size: 18px;}

	/* section01 */
	.section01 .section-title {margin-bottom: 45px;}
	.section-content ul.col-4 {margin: 0 -5px;}
	.section-content ul.col-4 li {padding: 0 5px;}
	.section-content ul.col-4 li .text-box {padding: 30px 5px 25px;}
	.section-content ul.col-4 li .text-box h4 {font-size: 20px; margin-bottom: 10px;}
	.section-content ul.col-4 li .text-box p {font-size: 16px; margin-bottom: 5px;}

	/* section02 */
	.section02 .section-title {max-width: none; padding-bottom: 0px;}
	.section02 .items {width: 100%;}
	.section02 .section-title {position: relative; padding-right: 0;}
	.section02 .section-title small {margin-bottom: 20px;}
	.section02 .section-title h3 {margin-bottom: 15px;}
	.section02 .section-title p {margin-bottom: 50px;}

	.section02 .arrows {position: absolute; bottom: 0; right: 0;}
	.section02 .arrows .slick-arrow {width: 55px; height: 55px; background-size: 55px auto;}

	.section02 .items {position: relative; top: 0; left: 0; width: 100%; margin: 0 -10px;}
	.section02 .item {padding: 0 10px;}
	.section02 .item .text-box {padding: 20px 0 40px;}
	.section02 .item .text-box h4 {font-size: 20px;}
	.section02 .item .text-box p {font-size: 16px;}

	.section02 .bar {max-width: none; width: 100%;}

	/* section03 */
	.section03 {padding: 80px 0 90px;}
	.section03 .section-title {margin-bottom: 45px;}
	.section03 .section-title small.eng {margin-bottom: 20px;}
	.section03 .section-title h3 {margin-bottom: 15px;}

	.section03 .section-content ul {margin: 0 -10px;}
	.section03 .section-content ul li {padding: 0 10px;}
	.section03 .section-content ul li .text-box h4 {font-size: 20px; margin-bottom: 10px;} 
	.section03 .section-content ul li .text-box p {font-size: 16px;}

	/* section04*/
	.section04 {padding: 90px 0 70px;}
	.section04:after {background-size: 260px auto; top: 240px; margin-left: -100px;}
	.section04 .section-title {padding-bottom: 260px;}
	.section04 .section-title small.eng {margin-bottom: 20px;}
	.section04 .section-title h3 {font-size: 34px; margin-bottom: 50px;}
	.section04 .section-title .img-box {background-size: auto 480px;}
	.section04 .section-content h4 {font-size: 20px; margin-bottom: 20px;}
	.section04 .section-content h4 br {display: none;}
	.section04 .section-content h4 span {font-size: 30px;}
	.section04 .section-content ul li {font-size: 16px;}

	/* section05 */
	.section05 .section-title small {margin-bottom: 20px;}
	.section05 .section-title h3 {margin-bottom: 15px;}
	.section05 .section-title p {margin-bottom: 50px;}

	/* section06 */
	.section06 {padding: 100px 0 0;}
	.section06:before {height: 480px;}
	.section06 .section-title h3 {margin-bottom: 25px;}
	.section06 .section-title p {font-size: 20px; margin-bottom: 50px;}
	.section06 .item {padding: 0 10px;}
	.section06 .item img {max-width: 320px;}

	/* section07 */
	.section07 {padding: 80px 0 90px;}
	.section07 .info-wrap {display: block;}
	.section07 .text-box {max-width: none; padding-right: 0;}
	.section07 .section-title small {font-size: 20px; margin-bottom: 10px;}
	.section07 .section-title h3 {margin-bottom: 15px;}

	.section07 .info dl {padding: 15px 0;} 
	.section07 .info dt {width: 112px; font-size: 18px;}
	.section07 .info dd {font-size: 18px; margin-left: 20px;}
	.section07 .info .kakao {padding: 7px 0;}
	.section07 .info .kakao dd {height: 45px; padding: 0 15px;} 
	.section07 .info .hours {padding: 10px 0;}
	.section07 .info .hours dd p:not(:last-child) {margin-bottom: 8px;}
	.section07 .info .address p {margin: 5px 0;}
	.section07 .info .blog {padding: 7px 0;}
	.section07 .info .blog dd {padding: 10px 20px 10px 15px;}
	.section07 .info .blog dd a span {font-size: 16px;}
	.section07 .info .blog img {margin-right: 5px; width: 40px;}

	.section07 .map {max-width: 100%; height: 350px;}
	.section07 .root_daum_roughmap {width:100% !important; height:350px !important; border: 10px solid #fff; margin-top: 10px;}
	.section07 .root_daum_roughmap .wrap_map {height:350px !important;}
	.section07 .root_daum_roughmap .map_border {border: 10px solid #fff; !important; width:0 !important; height:0 !important;}

	/* footer */
	#footer {padding: 40px 0 50px;}
	#footer .footer-top {margin-bottom: 30px;}
	#footer .footer-top .logo img {width: 180px;}
	#footer .footer-top .contact p {font-size: 20px; margin-bottom: 5px;}
	#footer .footer-top .contact a {font-size: 30px;}
	#footer .footer-top .tel {margin-bottom: 20px;}
	#footer .footer-top .kakao a {font-size: 25px;}
	#footer .footer-bottom .info ul {margin-bottom: 20px;}
	#footer .footer-bottom .info ul li {font-size: 16px; margin-bottom: 5px;}
	#footer .footer-bottom .copy {font-size: 16px;}
}

@media (max-width: 768px) {
	/* header */
	#header {height:100px;}
	/* #header .sitelogo a {width: 130px; background-size: 130px auto; margin-top: -23px;} */
	.lang-selector {top: 50px; right: 60px; transform: translateY(0);}
	.mems {right: 50px; top: 15px; transform: translateY(0);}
	/* .site-wrap .logo img {width: 130px;} */

	/* main-visual */
	.main-visual .content .wrap {height: calc(100% - 60px); margin-top: 60px;}
	.main-visual .content .wrap .items {margin-bottom: 50px;}
	.main-visual .content .text-box h2 {font-size: 30px; margin-bottom: 15px;}
	.main-visual .content .text-box p {font-size: 16px; margin-bottom: 20px; padding-right: 30px;}
	.main-visual .content .text-box p br {display: none;}
	.main-visual .content .text-box .more-btn {width: 125px; font-size: 15px; line-height: 45px;}
	.main-visual .paging {margin-right: 20px;}
	.main-visual .pro-wrap {position: relative; width: 130px; margin-right: 20px;}

	/* section common */
	section {padding: 60px 0 70px;}
	.section-title small {font-size: 18px; margin-bottom: 10px;}
	.section-title small.eng {font-size: 16px;} 
	.section-title h3 {font-size: 26px;}
	.section-title p {font-size: 16px;}

	/* section01 */
	.section01 .section-title {margin-bottom: 40px;}
	.section-content ul.col-4 {flex-wrap: wrap; margin: -5px;}
	.section-content ul.col-4 li {width: 50%; padding: 5px;}
	.section-content ul.col-4 li .text-box {padding: 20px 5px 15px;}
	.section-content ul.col-4 li .text-box h4 {font-size: 18px; margin-bottom: 5px;}
	.section-content ul.col-4 li .text-box p {font-size: 15px;}

	/* section02 */
	.section02 .section-title {max-width: none; margin-bottom: 30px;}
	.section02 .items {width: 100%;}
	.section02 .section-title {position: relative;}
	.section02 .section-title small {margin-bottom: 10px;}
	.section02 .section-title h3 {margin-bottom: 15px;}
	.section02 .section-title p {margin-bottom: 20px;}

	.section02 .arrows {position: relative;}
	.section02 .arrows .slick-arrow {width: 50px; height: 50px; background-size: 50px auto;}

	.section02 .items {margin: 0 -5px;}
	.section02 .item {padding: 0 5px;}
	.section02 .item .text-box {padding: 15px 0 30px;}
	.section02 .item .text-box h4 {font-size: 18px; margin-bottom: 5px;}
	.section02 .item .text-box p {font-size: 15px;}

	/* section03 */
	.section03 {padding: 60px 0 70px;}
	.section03 .section-title {margin-bottom: 40px;}
	.section03 .section-title small.eng {margin-bottom: 10px;}
	.section03 .section-title h3 {margin-bottom: 15px;}

	.section03 .section-content ul {flex-wrap: wrap; margin: -10px;}
	.section03 .section-content ul li {width: 50%; padding: 10px;}
	.section03 .section-content ul li .text-box h4 {font-size: 18px; margin-bottom: 5px;} 
	.section03 .section-content ul li .text-box p {font-size: 15px;}

	/* section04*/
	.section04 {padding: 70px 0 60px;}
	.section04:after {background-size: 170px auto; top: 200px; margin-left: -60px;}
	.section04 .section-title {padding-bottom: 260px; margin-bottom: 30px;}
	.section04 .section-title small.eng {margin-bottom: 15px;}
	.section04 .section-title h3 {font-size: 24px; margin-bottom: 30px;}
	.section04 .section-title .img-box {background-size: auto 300px; background-position: right bottom;}
	.section04 .section-content h4 {font-size: 18px; margin-bottom: 15px;}
	.section04 .section-content h4 span {font-size: 25px;}
	.section04 .section-content ul li {font-size: 15px;}

	/* section05 */
	.section05:before {height: 600px;}
	.section05 .section-title small {margin-bottom: 10px;}
	.section05 .section-title h3 {margin-bottom: 15px;}
	.section05 .section-title p {margin-bottom: 40px;}
	.section-content ul.col-4 li .text-box {height: auto;}

	/* section06 */
	.section06 {padding: 80px 0 0;}
	.section06:before {height: 480px;}
	.section06 .section-title h3 {margin-bottom: 15px;}
	.section06 .section-title p {font-size: 18px; margin-bottom: 40px;}
	.section06 .item {padding: 0 8px;}
	.section06 .item img {max-width: 250px;}

	/* section07 */
	.section07 {padding: 60px 0 70px;}
	.section07:before {display: none;}
	.section07 .section-title small {font-size: 18px; margin-bottom: 10px;}
	.section07 .section-title h3 {margin-bottom: 10px;}

	.section07 .info dl {display: block;} 
	.section07 .info dt {width: 100%; margin-bottom: 10px;}
	.section07 .info dt:after {display: none;}
	.section07 .info dd {width: 100%; flex: auto; font-size: 16px; margin-left: 0;}
	.section07 .info .kakao {padding: 15px 0;}
	.section07 .info .kakao dd {width: fit-content; flex: none; height: 38px;} 
	.section07 .info .kakao dd img {width: 30px;}
	.section07 .info .hours {padding: 15px 0;}
	.section07 .info .hours dd p:not(:last-child) {margin-bottom: 5px;}
	.section07 .info .hours dd span {margin-bottom: 0;}
	.section07 .info .address p {margin: 0;}
	.section07 .info .blog {padding: 15px 0;}
	.section07 .info .blog dd {width: fit-content; flex: none;padding: 5px 15px 5px 10px;}
	.section07 .info .blog dd a span {font-size: 15px;}
	.section07 .info .blog img {margin-right: 5px; width: 35px;}

	.section07 .map {height: 250px;}
	.section07 .root_daum_roughmap {height:250px !important;}
	.section07 .root_daum_roughmap .wrap_map {height:250px !important;}

	/* footer */
	#footer {padding: 40px 0 40px;}
	#footer .footer-top {display: block; margin-bottom: 20px;}
	#footer .footer-top .logo {margin-bottom: 15px;}
	#footer .footer-top .logo img {width: 130px;}
	#footer .footer-top .contact {position: relative; text-align: left;}
	#footer .footer-top .contact > div {display: flex; flex-wrap: wrap;}
	#footer .footer-top .contact p {font-size: 16px; margin-bottom: 0; margin-right: 15px;}
	#footer .footer-top .contact a {font-size: 23px;}
	#footer .footer-top .tel {margin-bottom: 5px;}
	#footer .footer-top .kakao a {font-size: 20px;}

	#footer .footer-bottom {display: block;}
	#footer .footer-bottom .info ul {margin-bottom: 15px;}
	#footer .footer-bottom .info ul li {font-size: 15px;}
	#footer .footer-bottom .copy {font-size: 15px; margin-bottom: 20px;}
}