@charset "euc-kr";
/* CSS Document */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://example.com/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(https://example.com/MaterialIcons-Regular.woff2) format('woff2'),
    url(https://example.com/MaterialIcons-Regular.woff) format('woff'),
    url(https://example.com/MaterialIcons-Regular.ttf) format('truetype');
}
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 1,
  'wght' 400,
  'GRAD' 0,
  'opsz' 48
}
/********************  noto+Sans+kr  ********************/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;600;700;800;900&display=swap'); 
/********************  noto+Sans+kr  ********************/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@font-face {font-family: 'GmarketSansLight'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
font-weight: normal; font-style: normal;}
@font-face {font-family: 'GmarketSansMedium'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
font-weight: normal; font-style: normal;}
@font-face {font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
font-weight: normal; font-style: normal;}

*{margin:0; padding:0; font-family: 'GmarketSansMedium' , sans-serif; box-sizing:border-box;}
select {

   -webkit-appearance:none; /* for chrome */

   -moz-appearance:none; /*for firefox*/

   appearance:none;

}

select::-ms-expand{

   display:none;/*for IE10,11*/

}

/****reset*****/
a {text-decoration: none;}
.clearfix:before,
.clearfix:after{display:table; content:"";}
.clearfix:after{clear:both;}
ul,li{list-style:none;}
body{position: relative;height: 100%;}
table {border-collapse: collapse;}
.w1200 {width: 1200px; margin: 0 auto; max-width: 100%;}


/* top */
.top {}
.top .top_kakao {display: block; text-align: center; height: 50px; overflow: hidden; position: relative;}
.top .top_kakao img {position: absolute; left: 50%; transform: translateX(-50%); height: 54px;}

.top .top_login {position: relative; height: 100px;}
.top .top_login .top_call {float: left; padding-top: 25px;}
.top .top_login .top_call img {display: block;}
.top .top_login .logobox {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

.top .top_login .loginbox {float: right;}
.top .top_login .loginbox li {float: left; margin-left: 15px;}
.top .top_login .loginbox li a {color: #333; font-size: 12px; line-height: 100px;}
.top .top_login .loginbox li:last-child a {display: block;}
.top .top_login .loginbox li:last-child a img {vertical-align: middle;}

.top .top_menu {position: relative; height: 65px; background: #333;}
.top .menulist {}
.top .menulist ul {display: flex; justify-content: space-around;}
.top .menulist ul li {flex-grow: 1; position: relative; text-align: center;} 
.top .menulist ul li:last-child {margin-right: 0;}
.top .menulist ul li > a {color: #fff; line-height: 65px;}
.top .menulist ul li div {position: absolute; width: 150px; left: 50%; transform: translateX(-50%); top: 65px; text-align: center; background: #fff; box-shadow: 5px 5px 19px 1px rgba(0,0,0,0.13); z-index: 99999; transition: .3s; display: none;}
.top .menulist ul li div a {display: block; font-size: 12px; color: #666; padding: 15px 0; font-weight: 300; transition:.2s;}
.top .menulist ul li div a:hover {color: #000; font-weight: 900;}


.topbtn {position: fixed; bottom: 25px; right: 25px; display: block; width: 50px; height:50px; background: #15773f; z-index: 999999999; text-align: center; display: none; border-radius: 50%;}
.topbtn:before {position: absolute; content: ''; width:12px; height: 12px; border-top: 3px solid #fff; border-right: 3px solid #fff;); display: inline-block; transform: translate(-50%,-50%) rotate(-45deg); position: absolute; top: 50%; left: 50%; transition: .3s;}
.topbtn:hover:before {top: 50%;}
.topbtn a {display: block; height: 100%; position: relative;}

/* sidemenu */

/* slidetext */ 
.slidetxt {position:absolute; left: 50%; top: 30%; transform: translate(-50%,-30%); z-index:9999; text-align: center; width: 1200px; line-height: 2.5em; display: none;}
.slidetxt img {display: inline-block; margin-bottom: 40px;}
.slidetxt h1 {font-size: 42px; font-family: 'GmarketSansLight'; font-weight: lighter;}
.slidetxt h1 strong {font-family: 'GmarketSansBold'; color: #15773f;}
.slidetxt h2 {font-size: 32px; font-family: 'GmarketSansLight'; font-weight: lighter;}
.slidetxt h2 strong {font-family: 'GmarketSansBold';}
.slidetxt a {background: #333; padding: 5px 40px; font-size: 24px; font-family: 'GmarketSansMedium'; color: #fff; border-radius: 28px; display: inline-block; margin-top: 40px; transition: .5s;}
.slidetxt a:hover {background: #fff; color: #15773f;}
/* footer */
.mapbox {background: #333; padding: 20px 20px; width: 100%; margin: 0 auto;}
.mapbox .maptxt {text-align: center; color: #fff;}
.mapbox .maptxt h3 {letter-spacing: 10px; font-size: 14px;}
.mapbox .maptxt h3 {margin: 5px 0;}
.mapbox .maptxt p {margin: 5px 0;}
.mapbox .maptxt h1 {padding-bottom: 20px;}
.footer {background: #666; width: 100%; margin: 0 auto; margin-bottom: 60px; text-align: center;}
.footer p{padding:20px; line-height:1.5em; color: #ddd;}
.footer p span{margin-right:15px; font-size:16px; font-weight:400;}

.copy { margin-top: 70px; border-top: 2px solid #15773f; padding-bottom: 70px;}
.copy ul {text-align: center; height: 80px; border-bottom: 1px solid #ddd; margin-bottom: 50px;}
.copy ul li {display: inline-block;}
.copy ul li span {padding: 0 25px;}
.copy ul li a {color: #333; line-height: 80px; font-size: 14px;}
.copy .sbox {max-width: 1200px; margin: 0 auto; color: #666;}
.copy .sbox .ssbox {float: left;}
.copy .sbox .ssbox:nth-child(2) {margin-left: 75px;}
.copy .sbox .ssbox:nth-child(2) p {font-size: 14px; line-height: 1.8em;}
.copy .sbox .ssbox:last-child ul li {float: left;}
.copy .sbox .ssbox .copy_logo {opacity: .7;}

/*section*/
/*section_common*/
.txtbox {background: #333; text-align: center; padding: 4px 20px; color: #fff; font-weight: 700; font-size: 12px;}
.maintitle {font-weight: 700;text-align: center; color: #006FC4; font-size: 30px; border-bottom: 3px solid #006FC4; padding-bottom: 5px;margin-bottom: 20px; display: inline-block;}
.btn_more {padding: 8px 15px; color: #fff; border: 1px solid  #fff; font-size: 14px;}
.main_contbox h3 {font-size: 24px; font-weight: 700;}
.main_contbox p {padding-top: 15px; padding-bottom: 20px; font-size: 14px;}
.main_contbox a:hover {color: #000; background: #fff;}
.main_contbox {float: left; width: 25%; text-align: center; padding: 50px 0; color: #fff; height: 234px;}

.mySwiper {
			 position: relative;
			 z-index: 99;
			overflow: hidden;
/*            height: 600px;*/
/*        float: left;*/
      }
.mySwiper1 {
        overflow: hidden;
        position: relative;
      }
.mySwiper2 {
        overflow: hidden;
        position: relative;
        padding: 0;
      }
.swiper-pagination-bullet-active {background: #fff;}
      .swiper-slide {
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        position: relative;
      }
.mySwiper .swiper-slide {position: relative;}
.mySwiper .swiper-slide .simg {width: 100%;}

.mySwiper .swiper-wrapper {position: relative;}
.mySwiper .swiper-button-next,
.mySwiper .swiper-button-prev {background: none; cursor: pointer;}
.mySwiper .swiper-button-next {position: absolute; width: 35px; height: 35px; border-top: 2px solid #15773f; border-right: 2px solid #15773f; display: inline-block; transform: rotate(45deg) translateY(-50%); position: absolute; top: 50%; right: 3%; z-index: 99999;}
.mySwiper .swiper-button-prev {position: absolute; width: 35px; height: 35px; border-top: 2px solid #15773f; border-right: 2px solid #15773f; display: inline-block; transform: rotate(225deg) translateY(-50%); position: absolute; top: 47%; left: 3%; z-index: 99999;}

.mySwiper1 .swiper-button-next,
.mySwiper1 .swiper-button-prev {background: none; cursor: pointer;}
.mySwiper1 .swiper-button-next {position: absolute; width: 35px; height: 35px; border-top: 2px solid #15773f; border-right: 2px solid #15773f; display: inline-block; transform: rotate(45deg) translateY(-50%); position: absolute; top: 50%; right: 3%; z-index: 99999;}
.mySwiper1 .swiper-button-prev {position: absolute; width: 35px; height: 35px; border-top: 2px solid #15773f; border-right: 2px solid #15773f; display: inline-block; transform: rotate(225deg) translateY(-50%); position: absolute; top: 47%; left: 3%; z-index: 99999;}

/*section*/
section{margin: 60px 0;}

.sectitle {text-align: center; padding: 30px 0;}
.sectitle h1 {font-family: 'GmarketSansBold'; font-size: 32px;}
.sectitle h1 strong {color: #15773f; font-family: 'GmarketSansBold';}

.main_guide {position: relative; height: 100px;}
.main_guide .w1200 {position: absolute; left: 50%; top: -160px; transform: translateX(-50%); z-index: 9999;}

.main_product ul li {float: left; width: 23.5%; margin-right: 2%; text-align: center; border: 1px solid #ddd; margin-top: 30px; position: relative; overflow: hidden;}
.main_product ul li:before {position: absolute; content: ''; width: 100%; height: 100%; background: #15773f; left: -100%; top: 0; transition:.3s; z-index: -1;}
.main_product ul li:hover a {color: #fff;}
.main_product ul li:hover:before {left: 0;}
.main_product ul li a {color: #333; display: block; height: 100%; transition:.3s;}
.main_product ul li:nth-child(4n) {margin-right: 0;}
.main_product ul li img {width: 100%;}
.main_product ul li h3 { margin-bottom: 10px; font-size: 24px;}
.main_product ul li div {padding: 15px 0; position: relative;}
/*.main_product ul li div:before {position: absolute; content: ''; background: #15773f; width: 100%; height: 100%; left: -100%; top: 0;}*/
.main_product ul li div p {font-size: 14px;}

.main_gall .sectitle {text-align: left; border-bottom: 1px solid #333; padding-bottom: 10px; position: relative;}
.main_gall .sectitle a {position: absolute; right: 0; bottom: 8px; font-size: 18px; color: #666;}
/*
.main_gall .sectitle a span {font-size: 18px; transition: .4s; transform-origin: center; width: 15px; height: 15px;}
.main_gall .sectitle a:hover span {transform: rotate(720deg);}
*/
.main_notice {background: #f0f0f0; padding: 50px 0;}
.main_notice .w1200 {padding: 40px 50px; background: #fff;}
.main_notice .w1200 ul li {float: left;}
.main_notice .w1200 ul li:nth-child(1) {width: 55%; margin-right: 10%;}
.main_notice .w1200 ul li:nth-child(2) {width: 35%;}
.main_notice .w1200 ul li .main_notice_title h1 {color: #15773f;}
.main_notice .w1200 ul li .main_notice_title {border-bottom: 1px solid #333; padding-bottom: 10px; position: relative; margin-bottom: 15px;}
.main_notice .w1200 ul li .main_notice_title a {position: absolute; right: 0; bottom: 10px; color: #333;}

.main_notice .w1200 ul li:nth-child(2) div {width: 70%; position: relative; height: 50px; border: 2px solid  #525252; border-radius: 10px; overflow: hidden;}
.main_notice .w1200 ul li:nth-child(2) div span {text-align: center; font-size: 30px; width: 60px; height: 60px; background: #525252; color: #fff; line-height: 60px; position: absolute; top: 50%; transform: translateY(-50%); left: 0px;}
.main_notice .w1200 ul li:nth-child(2) div p {line-height: 50px; font-size: 22px; padding-left: 75px;}

.main_notice .w1200 ul li:nth-child(2) > p {margin-top: 20px;}
.main_notice .w1200 ul li:nth-child(2) > p b {font-size: 20px; color: #15773f;}

.main_insta .w1200 .sectitle {text-align: left;}
.main_insta .w1200 .sectitle span {font-size: 14px; color: #666;}
/**************sub common*********************/
.smenu li {float: left; width: 25%; border: 1px solid #ddd; text-align: center;}
.smenu li a {display: block; height: 50px; color: #666; line-height: 50px;}
.smenu01 li {width: 33.33333%;}

.sub1 .smenu ul li:nth-child(1) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub2 .smenu ul li:nth-child(2) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub3 .smenu ul li:nth-child(3) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub4 .smenu ul li:nth-child(4) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub5 .smenu ul li:nth-child(5) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub6 .smenu ul li:nth-child(6) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub7 .smenu ul li:nth-child(7) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub8 .smenu ul li:nth-child(8) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub9 .smenu ul li:nth-child(9) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub10 .smenu ul li:nth-child(10) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}
.sub11 .smenu ul li:nth-child(11) a {background: #15773f; color: #fff; border: 1px solid  #15773f;}


.slidebanner {margin: 40px 0; padding-bottom: 40px;}
.banner_wraper { height: 60px; width: 1300px; position: absolute; overflow: hidden; margin: 0 auto; left: 50%; transform: translateX(-50%); }
.banner_wraper li {width: 180px;}
.banner_wraper img { height: 45px; position: absolute; }

.w1300 {width: 1300px; margin: 0 auto; max-width: 100%;}
.sub .subtitle {margin: 50px 0; text-align: center; }
.sub .subtitle h1 {display: inline-block; position: relative;}
.sub .subtitle h1:before {position: absolute; content: ''; left: 0; bottom: -5px; background: #15773f; width: 100%; height: 3px;}
.sub .member_title {margin: 50px 0; text-align: center; }
.sub .member_title h1 {display: inline-block; position: relative;}
.sub .member_title h1:before {position: absolute; content: ''; left: 0; bottom: -5px; background: #15773f; width: 100%; height: 3px;}

.sub_location {text-align: center;}
.sub_location h3 {color: #15773f; font-size: 24px; margin-bottom: 10px; margin-top: 20px;}
.sub_location p {position: relative; padding-left: 10px; color: #666; font-size: 18px; line-height: 1em; margin-bottom: 20px; display: inline-block;}
.sub_location p:before {position: absolute; content: ''; top: 36%; transform: translateY(-50%); left: 0; width: 6px; height: 6px; background: #15773f; border-radius: 50%;}

.sub .prd_cate {display: none;}

.sub_buy > h4 {color: #15773f; font-size: 18px;}
.sub_buy p {color: #666; line-height: 2.5em; font-size: 18px;}
.sub_buy .sub_buy_txt div {margin-top: 20px; margin-bottom: 40px;}
.sub_buy .sub_buy_txt div h3 {color: #15773f; padding-left: 18px; position: relative; font-size: 24px;}
.sub_buy .sub_buy_txt div h3:before {position: absolute; content: ''; width: 15px; height: 15px; background: #15773f; top: 50%; transform: translateY(-50%); left: -5px;}
.sub_buy .sub_buy_txt div h3:after {position: absolute; content: ''; width: 9px; height: 9px; background: #fff; border-radius: 50%; top: 50%; transform: translateY(-50%); left: -2px;}

.sub_buy .sub_buy_txt div ul {margin-top: 10px; margin-bottom: 20px;}
.sub_buy .sub_buy_txt div ul li {background: #15773f; color: #fff; width: 150px; height: 150px; text-align: center; display: inline-block; border-radius: 50%; margin-right: 30px; position: relative;}
.sub_buy .sub_buy_txt div ul li:before {position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 90%; height: 90%; border-radius: 50%;; border: 2px solid  #fff; animation: blinking 1s 1s infinite alternate;}
.sub_buy .sub_buy_txt div ul li:after {position: absolute; content: ''; top: 50%; right:-20px; transform: translateY(-50%) rotate(45deg); width: 20px; height: 20px; border-top: 2px solid #15773f; border-right: 2px solid #15773f; animation: blinking 1s 1s infinite alternate;}
.sub_buy .sub_buy_txt div ul li:last-child:after {display: none;}
@keyframes blinking {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
.sub_buy .sub_buy_txt div ul li h2 {font-size: 18px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%;}

.board a {color: #333;}

.subtop {height: 400px; text-align: center; color: #fff; display: none;}
.subtop h1 {font-size: 60px; padding-top: 150px;}
.subtop p {font-size: 18px;}
.subtop02 {background: url(../img/subtop02.jpg) no-repeat center / cover;}
/********************sub*********************/
.sub01_01 .sub_intro ul li {width: 50%; float: left;}
.sub01_01 .sub_intro ul li:nth-child(1) img {width: 100%;}
.sub01_01 .sub_intro ul li:nth-child(2) {padding-left: 50px;}
.sub01_01 .sub_intro ul li:nth-child(2) h1 {color: #15773f;  margin-right: 30px; margin-top: 20px;}
.sub01_01 .sub_intro ul li:nth-child(2) p { margin-top: 30px; margin-bottom: 50px; color: #666; font-weight: 300; line-height: 1.8em;}
.sub01_01 .sub_intro ul li:nth-child(2) h3 {text-align: right; color: #15773f;}
.sub01_01 .sub_intro ul li:nth-child(3) {width: 100%; margin-top: 50px; text-align: center;}
.sub01_01 .sub_intro ul li:nth-child(3) h3 {color: #15773f; font-size: 32px; margin-bottom: 20px}
.sub01_01 .sub_intro ul li:nth-child(3) img {display: inline-block; margin-right: 15px;}
.sub01_01 .sub_intro ul li:nth-child(3) img:last-child {margin-right: 0;}
.sub01_02 .w1300 .stable {width: 100%;}
.sub01_02 .w1300 .stable th {background: #15773f; color: #fff;}
.sub01_02 .w1300 .stable th,
.sub01_02 .w1300 .stable td {padding: 15px 25px;}

.sub01_03 table {border-color: #ddd; color: #666; font-size: 12px;}
.sub01_03 table tr td{ font-family: 'GmarketSansLight' , sans-serif; font-weight: bold;}

.sub01_04 .sub_team {text-align: center;}
/*.sub01_04 .sub_team img {width: 80%;}*/
.sub01_05 .sub_chief table th,
.sub01_05 .sub_chief table td {padding: 5px;}

.sub01_06 .sub_team a {color: #333;}


.product_des {text-align: center;}
.product_des p {font-size: 24px; font-family: 'GmarketSansBold' , sans-serif; color: #15773f; line-height: 2em;}
.product_des strong {}

.sub02_01 .sub_member {text-align: center;}
.sub02_01 .sub_member p {font-size: 18px; margin-bottom: 25px; line-height: 2em;}
.sub02_01 .sub_member h3 {font-size: 24px; margin-bottom: 25px;}
.sub02_01 .sub_member a img {width: 100px;}


@media (max-width: 575px) {
	.w1300 {width: 100%;}
	.w1200 {width: 100%;}
}