@media (max-width: 640px){

.serif {font-family: "Noto Serif KR", serif;}


#main1 .tit1 {font-size:16px; padding-top: 80%;}
#main1 .tit2 {font-size:32px; padding-right:2%;}

#main2 .tit1 { font-size:19px; padding-top: 0%;}
#main2 .tit2 { font-size: 32px;padding-top: 2%;padding-bottom: 4%; }
#main2 .section1 {position: relative; width: 100%; float: none;  background-size:80%;}
#main2 .section1 img {padding-left:30%; width: 240px; }
#main2 .section2 {position: relative; width: 100%; float: none; padding-bottom:10%;}
#main2 .section2 .viewmore { width:90%; height:90%;  top:50%; left:50%; transform:translate(-50%,-50%);}
#main2 .section2 .viewmore p.t3 {font-size: 15px; font-weight: 300; margin-bottom: 2%;}
#main2 .section2 p.t1 {font-size:32px; font-weight:700; padding-bottom:4%;}
#main2 .section2 p.t1 span {font-size:22px; font-weight:500;}
#main2 .section2 p.t2  {font-size:17px;}
#main2 .section2 p.t3 {font-size:16px; padding-bottom:2%; }


#main3 .main3 .tit1 { font-size:32px; }
#main3 .main3 .tit2 { font-size: 16px; margin-top:1%;}
#main3 .main3 .content { padding: 7% 0; }
#main3 .main3 .content ul { padding: 8% 10%; border-radius: 20px;}
#main3 .main3 ul .t1 {font-size: 24px;}
#main3 .main3 ul .t2 {font-size: 15px;}
#main3 .main3 ul .t3 {font-size: 15px;}

#main4 {height:670px; padding-top: 28%;}
#main4 .tit1 {font-size: 15px; box-sizing:border-box; padding:0 10%; }
#main4 .tit2 {font-size: 25px; width:90%;}
#main4 .content { padding:8% 0; height: auto;}
#main4 .content .tit {width:100%; padding-left: 5%; padding-bottom:5%; font-size:20px;}
#main4 .content ul {width: 100%; padding: 0 5%;}
#main4 .content ul li { font-size: 16px; width: 48%; margin-right: 2%; box-sizing:border-box; }
#main4 .content ul li:nth-child(5n) { margin-right: 2%;}
#main4 .content ul li:nth-child(2n) {margin-right:0%;}

#main5 {padding: 15% 0;}
#main5 .tit { width:100%; float:none; font-size:20px;}
#main5 .slide {width: 100%; float:none; padding-top:5%; padding-left:5%;}
#main5 .slide ul li.t1 { font-size: 18px;}
#main5 .slide ul li.t2 { font-size: 15px;}

#main6 .content .con { width: 100%; height: 200px;}
#main6 .content .con .txt .t1  {font-size: 26px;}
#main6 .content .con .txt .t2  {font-size: 15px;}

#main7 {padding-top: 15%;}
#main7 .main7 .contentbox .bgtxt {right:0; font-size:90px; text-align:right;}
#main7 .main7 .contentbox.box2 .bgtxt {font-size: 90px;}
#main7 .main7 .contentbox .txt {width: 100%; float: none;}
#main7 .main7 .contentbox.box2 .img {width: 100%; float: none;}
#main7 .main7 .contentbox .img {width: 100%; padding-top:5%; float: none;} 
#main7 .main7 .contentbox.box2 .txt {position: relative; width: 100%; float:none; padding-top:5%;} 
#main7 .main7 .contentbox .txt .t1 {font-size: 23px;}
#main7 .main7 .contentbox .txt .t2 {font-size: 14px;}
#main7 .main7 .contentbox .img img{width: 100%;}

#main8 {padding: 7% 0 10% 0;}
#main8 .main8 .bgtxt { font-size: 60px;}
#main8 .main8 .contentbox { position: relative; width: 100%; padding: 11% 0 3% 0%;overflow: hidden;}
#main8 .main8 .contentbox .slide {padding-bottom: 10%; padding-left: 0%;}
#main8 .main8 .contentbox ul.slide li.img {width: 100%;}
#main8 .main8 .contentbox ul.slide li.text { width:100%;}
#main8 .main8 .contentbox ul.slide li.text .t1 {height: 40px; font-size: 17px; line-height: 40px;border-radius: 40px;}
#main8 .main8 .contentbox ul.slide li.text .t2 {font-size: 15px; }
#main8 .main8 .contentbox .txt .t1 {font-size: 23px;}
#main8 .main8 .contentbox .txt .t2 {font-size: 14px;}
#main8 .main8swiper .swiper8btn {display:none;}
#main8 .swiper-pagination {bottom:0; text-align:center;}


#main9 {padding: 15% 0;}
#main9 .main9 .tit1 {font-size: 24px;  padding-bottom: 5%;}
#main9 .main9 .tit2 {font-size: 14px;  padding-bottom: 10%;}


#main10 {position: relative; width: 100%;height: auto;}
#main10 .section1 { position: relative; width: 100%; height: auto; float: none; padding:10% 3%;}
#main10 .section1 .box3 .link { font-size: 15px;}
#main10 .section1 .box3 .link .kakao {height:30px; border-radius:30px;}
#main10 .section1 .box3 .link .kakao a{ line-height:30px; }
#main10 .section1 .box3 .link .naver {height:30px; border-radius:30px;}
#main10 .section1 .box3 .link .naver a{ line-height:30px; }
#main10 .section1 .box1 .t1 {font-size:20px; }
#main10 .section1 .box1 .t2 {font-size:18px; }
#main10 .section1 .box1 .t3 {font-size:16px; font-weight:600; padding-bottom:1.2%;}
#main10 .section1 .box1 .t4 {font-size:16px; }

#main10 .section1 .box2 .tit {font-size:20px; }
#main10 .section1 .box2 .time {font-size:18px;}
#main10 .section2 .mapp { width: 160px;}
#main10 .section2 { position: relative; width: 100%; height: 300px; float: none;}
#main10 .section2 { position: relative; width: 100%;float: none;}

#main11 {padding: 12% 0;}

#main11 .swiper { padding: 8% 0;}
#main11 .swiper .slidebox .box1  {height:200px;}
#main11 .swiper .slidebox .box2 .t1 {font-size:20px;}
#main11 .swiper .slidebox .box2 .t2 {font-size:22px; padding:3% 0;}
#main11 .swiper .slidebox .box2 .t3 {font-size:15px; padding:0% 2%; line-height:1.4;}
#main11 .swiper11btn {display:none;}

footer { padding: 12% 3% }
footer .logo { padding-bottom: 5%;width: 220px;}
footer .copy {font-size: 13px;}
footer .copy span{letter-spacing:2px; font-size:13px; }



}



@media (max-width: 300px){
#main10 .section1 .box1 .t1 {font-size:14px; }
#main10 .section1 .box1 .t2 {font-size:14px; }
#main10 .section1 .box1 .t3 {font-size:14px; }
#main10 .section1 .box2 .tit {font-size:14px; }
#main10 .section1 .box2 .time {font-size:14px;}
#main10 .section1 .box2 .red {font-size:14px;}
}
