header {position:relative;}
header .mbtn {position:absolute; top:50%; transform:translateY(-50%); font-size:20px; padding:5px; background-color:#fff;}
header [class*="zicon-"] {margin-right:3px;}
header [class*="area-hd-"] {background-color:#fff;}
header [class*="area-hd-"] [class*="area-"] {display:inline-block; font-size:0; vertical-align:top;}
header [class*="area-hd-"] .area-logo, header [class*="area-hd-"] .area-hdbn {width:250px;}
header [class*="area-hd-"] .area-search {float:right;}
header [class*="area-hd-"] .area-search input {border:0;}
header [class*="area-hd-"] .area-logo .logo-box {font-size:30px; display:inline-block; font-weight:bold; text-transform:uppercase;}
header [class*="area-hd-"] .search-box {position:relative;}
header [class*="area-hd-"] .search-box>form {}
header [class*="area-hd-"] .search-box>form>input[name="keyword"] {height:38px; border:#333 solid 1px; padding:10px 20px; vertical-align:top;}
header [class*="area-hd-"] .search-box>form>input[name="keyword"]:focus {background-color:#333; color:#fff;}
header [class*="area-hd-"] .search-box>form>button[name="button"] {height:38px; padding:10px; background-color:#333; color:#fff;}
header [class*="area-hd-"] .search-box>form>button[name="button"]:hover {color:#ffc945;}
header .area-hd-main {padding-top:90px; padding-bottom:50px;}
header .area-hd-sub {padding-top:70px; padding-bottom:30px;}
nav .area-left {display:inline-block; font-size:14px;}
nav .area-right {float:right;}
nav .area-menu0 {height:38px; background-color:#fff; color:#333; padding:10px; border-bottom:#dfdfdf solid 1px; position:absolute; top:0; left:0; width:100%; overflow:hidden;}
nav .area-menu0 a {color:#333;}
nav .area-menu0 a:hover {background-color:#ffc945;}
nav {background-color:#fff; color:#fff; min-height:41px; border-top:#60584c solid 2px; border-bottom:#dfdfdf solid 1px;}
nav .wrap {position:relative;}
nav .pbtn {padding:10px; font-size:16px; width:100%; text-align:left; background-color:#60584c; color:#fff;}
nav .area-menu1 {position:absolute; width:250px; top:0; left:0; background-color:#60584c; z-index:10;}
nav .area-menu2 {margin-left:250px; text-align:right;}
.top-banner {height:370px; background-color:#fff; border-bottom:#fff solid 5px;}
.top-banner .wrap {position:relative; height:100%;}
.top-banner .banner {position:absolute; right:0; top:50%; transform:translateY(-50%); padding:20px; max-width:350px; color:#fff; word-break:keep-all;}
.top-banner .banner .txt1 {font-size:20px; font-weight:bold;}
.top-banner .banner .txt2 {font-size:35px; line-height:120%; font-family: 'Do Hyeon', sans-serif;}
.top-sbanner {background-color:#333; border-bottom:#fff solid 3px;}
.top-sbanner>.wrap {position:relative; height:225px;}
.top-sbanner .text-box {text-align:right; color:#fff; padding-top:30px; text-shadow:#999 1px 1px 1px;}
.top-sbanner .text-box>.t1 {font-size:30px; font-family: 'Kumar One', cursive;}
.top-sbanner .text-box>.t2 {font-size:25px; font-family: 'Do Hyeon', sans-serif;}
.sub-bg0 {background-image:linear-gradient(141deg, #feebb2 0%, #eef2f3 51%, #8e9eab 70%);}
.sub-bg1 {background-image:linear-gradient(141deg, #feebb2 0%, #c2e59c 51%, #64b3f4 70%);}
.sub-bg2 {background-image:linear-gradient(141deg, #feebb2 0%, #8DC26F 51%, #76b852 70%);}
.sub-bg3 {background-image:linear-gradient(141deg, #feebb2 0%, #eea849 51%, #f46b45 70%);}
.sub-bg4 {background-image:linear-gradient(141deg, #feebb2 0%, #FBD3E9 51%, #d66aa3 70%);}
.sub-bg5 {background-image:linear-gradient(141deg, #feebb2 0%, #b6fbff 51%, #83a4d4 70%);}
.sub-bg6 {background-image:linear-gradient(141deg, #feebb2 0%, #FFD194 51%, #D1913C 70%);}
.area-smenu {position:absolute; right:0; bottom:-3px;}
.area-smenu .menu2>ul li {background-color:#fff; display:inline-block; border-radius:5px 5px 0 0; overflow:hidden; margin-left:1px;}
.area-smenu .menu2>ul li:hover {border-top:#fff solid 5px;}
.area-smenu .menu2>ul li.ative {background-color:#efefef; border-top:#fff solid 5px;}
.area-smenu .menu2>ul li.ative:hover {border-top:#333 solid 5px;}
.area-smenu .menu2>ul li a {display:inline-block; padding:10px;}
.content .area-widget {display:inline-block; width:250px; height:100%; background-color:#fff; position:static;}
.content .area-bbs {padding-top:20px; padding-bottom:50px; padding-left:270px; font-size:12px;}
main section {position:relative; padding:70px 0 30px 0;}
main section .wrap {position:relative;}
main section h1 {font-size:25px; font-weight:bold; margin-bottom:20px; text-align:center;}
main section.wg2, main section.wg4 {background-color:#dfdfdf;}
main section:last-child {margin-bottom:50px;}
footer {background-color:#686765; color:#fff;}
footer .ft-menu {padding:10px 0; background-color:#42403c; text-align:center;}
footer .ft-menu li {display:inline-block; padding:0 10px; border-left:#686765 solid 1px;}
footer .ft-menu li:first-child {border-left:none;}
footer .ft-menu a {color:#fff;}
footer .ft-menu a:hover {color:#ffc945;}
footer .ft-address {padding:20px 0;}
footer .box-logo {display:inline-block; width:250px; vertical-align:top;}
footer .box-address {display:inline-block;}
footer .box-address ul li:last-child {font-size:12px; color:#42403c; margin-top:10px;}
.popmenu.t1>.gotom {position:fixed; top:50%; right:20px; z-index:100; transform:translateY(-50%); background-color:rgba(255,255,255,0.7); border-radius:100px; padding:10px 5px;}
.popmenu.t1>.gotom>li {font-size:20px !important; width:30px; height:30px; text-align:center; border-radius:100%; margin-bottom:5px;}
.popmenu.t1>.gotom>li:hover {cursor:pointer; background-color:#ff9900; color:#fff;}
.popmenu.t1>.gotom>li:last-child {margin-bottom:auto;}

.info-main {position:fixed; left:10px; bottom:10px; z-index:10;}
.info-main .box {background-color:#42403c; border-radius:5px; width:200px; margin-bottom:20px; font-size:0; color:#fff;}
.info-main .box>.title {background-color:#2a2825; text-align:center;}
.info-main .box>li {font-size:16px; padding:5px; font-size:16px;}
.info-main .box>li>a {color:#fff;}
.info-sub {position:absolute;}
.info-sub .wrap {width:100%;}
.info-sub .box {background-color:#42403c; width:250px; font-size:0; vertical-align:top;}
.info-sub .box>.title {background-color:#2a2825; color:#fff; padding:10px; font-size:15px;}
.info-sub .box>li {padding:5px 10px; color:#fff; font-size:16px;}
.info-sub .box>li>a {color:#fff;}

@media screen and (max-width:1500px) {
    .info-main {position:relative; background-color:#333; left:0; bottom:0; padding:50px 0;}
    .info-main .box {display:inline-block; vertical-align:top; margin-bottom:auto; width:30%; margin-right:5%;}
    .info-main .box:last-child {margin-right:auto;}
}
@media screen and (min-width:1000px) {
    footer .box-logo {margin-right:50px;}
}
@media screen and (min-width:769px) {
    .mbtn {display:none;}

}
@media screen and (max-width:768px) {
    header [class*="area-hd-"] .area-logo {width:100%; text-align:center;}
    header [class*="area-hd-"] .area-search {display:none; float:none; position:absolute; left:0; bottom:0; transform:translateY(100%); z-index:10; width:100%;}
    header [class*="area-hd-"] .search-box>form>input[name="keyword"] {width:80%;}
    header [class*="area-hd-"] .search-box>form>button[name="button"] {width:20%;}
    header .area-hd-main {padding-top:20px; padding-bottom:20px;}
    header .area-hd-sub {padding-top:10px; padding-bottom:10px;}
    .btn-menu {left:10px;}
    .btn-search {right:10px;}
    .btn-close {margin-top:10px;}
    nav {display:none; position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; overflow-y:auto;}
    nav .area-menu0 {position:sticky;}
    nav .area-menu1 {width:100%; position:relative;}
    nav .area-menu2 {width:100%; position:relative; margin:auto !important; text-align:left;}
    nav .area-menu2 li {display:block; border-bottom:#dfdfdf solid 1px;}
    nav .area-left h1 {position:relative;}
    nav .area-left .title {display:none;}
    .top-sbanner .text-box {text-align:center;}
    .top-banner .banner {right:auto; left:50%; transform:translate(-50%,-50%);}
    .swiper-container.swiper-m1>.swiper-pagination {width:auto;}
    .content .area-widget {display:none;}
    .content .area-bbs {padding-left:0;}
    footer .box-logo, footer .box-address {width:100%; text-align:center; padding:10px;}
    .info-sub {position:static;}
    .info-sub .box {display:inline-block; width:50%;}
    .info-sub .box>.title {text-align:center;}
    .info-sub .box>li {text-align:center;}
    .info-sub .info3 {display:none;}
}
@media screen and (max-width:550px) {
    .info-main .box {margin-right:auto;}
    .area-smenu {display:none;}
    .popmenu {display:none;}
    .info-main .box {width:100%;}
    .info-sub .box {width:100%;}
}
@media screen and (max-width:497px) {
    header .area-hd-main {padding-top:10px; padding-bottom:10px;}
    .popmenu {display:none;}
}