@charset "utf-8";
html, body{position: relative; width: 100%; transition: all .2s ease-in;}

.clearfix:after{
  content:'' !important; clear: both !important; display: block !important;
}

.mobileMenu{display: none;}
.main-nav > button,
.main-nav > a{display: none;}

header{position: relative; background: #FFF;}

.top-nav{background: #27812f;}
.top-nav ul{max-width: 1180px; margin: 0 auto; position: relative; }
.top-nav ul:after{content:'';clear: both;display: block;}
.top-nav li{float: right; border-right: 1px solid #68a76e;}
.top-nav li.favorite{position: absolute; top:0; left:0; border-right: 1px solid #68a76e; border-left: 1px solid #68a76e;}
.top-nav li:last-child{border-left: 1px solid #68a76e;}
.top-nav a{display: block; color: #FFF; padding: 16px 22px 17px; font-size: 13px;}
.top-nav li:hover a{background: #4c9853;}

.main-nav{max-width: 1180px; margin: 0 auto; padding: 18px 0px; font-size: 16.5px; color: #404040; position: relative;}
.logo{padding-left: 5px; display: inline-block; float: left;}
.main-left{float: left; margin-left: 44px;}
.main-right{float: right;}

.main-nav:after,
.main-nav ul:after{content:'';clear: both;display: block;}
.main-nav ul{padding-top: 4px; padding-bottom: 3px;}
.main-nav li{background: #FFF; margin-left: 5px; transition: all .2s ease-in;}
.main-nav li a{display: inline-block; padding: 12px 22px; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box;}
.main-nav li a:after{content:'';display: block; width: 0px; height:2px; background: #27812f; position: absolute; bottom: -1px; left: 50%; transition: all .2s ease-in;}

.main-left li{float: left;}

.main-right li{float: right;}
.main-right li:nth-child(1){ background: #27812f; color: #FFF; border-radius: 15px; }

.main-nav li:not(.inquiry):hover{ color: #27812f;}
.main-nav li:not(.inquiry):hover a:after{width: 80%; margin-left: -40%;}
.main-nav li.inquiry:hover{background: #3a9e43;}

.main-visual li{ height: 616px; background-position: top center; background-size: cover; }
.main-visual li > img{display: none;}

.main-visual .bx-wrapper{border: none; box-shadow: none; margin-bottom: 0;}
.main-visual .bx-controls-direction{
  position: absolute; top: 50%; left: 50%; margin-top: -16px;
  width: 100%; max-width: 1180px; margin-left: -590px;
}
.main-visual .bx-wrapper .bx-prev{ background: url(/asset/images/main/ArrowLeft.png) 0 0 no-repeat; width: 41px; height: 73px;}
.main-visual .bx-wrapper .bx-next{ background: url(/asset/images/main/ArrowRight.png) 0 0 no-repeat; width: 41px; height: 73px;}
.main-visual .bx-wrapper .bx-controls-direction a:hover,
.main-visual .bx-wrapper .bx-next:hover,
.main-visual .bx-wrapper .bx-next:focus{opacity: .8; background-position: 0 0;}

.main-visual ul.slider{height: 100%; -webkit-box-sizing: border-box;box-sizing: border-box;}
.main-visual .main-visualBg{display: block;position: absolute;top:0;left:0;width:100%;height:100%;background: url(/asset/images/main/blackbg.png) 50% no-repeat;}
.main-visual .main-visual-content{width: 100%; max-width: 1181px; margin: 0 auto; height: 100%; text-align: center; display: table; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box;}
/*.main-visual .ui-cell{ padding-top: 10%; }*/
.main-visual p{
  font-size: 60px;
  font-weight: bold;
  line-height: 1.5;
  color: #FFF;
  text-shadow: 1px 1px 10px #333;
}
.main-visual p.title{ font-size: 48px;}
.main-visual .ui-cell a{display: inline-block; background: #FFF; color: #33a62d; font-size: 17px; padding: 12px 25px; border-radius: 5px; vertical-align: middle;}
.main-visual .ui-cell a:hover{background: #33a62d; color: #FFF;}

.main-visual .bx-wrapper .bx-pager{ bottom: 2vw;}
.main-visual .bx-wrapper .bx-pager.bx-default-pager a{ background: #FFF; width: 13px; height: 13px; border-radius: 15px;}
.main-visual .bx-wrapper .bx-pager.bx-default-pager a.active{background: #1a9b31;}

.main-notice{background: #474343;}
.notice-wrap{color: #FFF; max-width: 1180px; margin: 0 auto;}
.main-notice .notice-wrap:after{content:'';clear: both;display: block;}
.main-notice h2{float: left; font-weight: bold; padding: 19px 0px; text-align: center; border-left: 1px solid #7f7c7c; border-right: 1px solid #7f7c7c; -webkit-box-sizing: border-box; box-sizing: border-box; width: 10%; }
.main-notice ul{float: left; width: 90%;}
.main-notice ul:after{content:'';clear: both;display: block;}
.main-notice li{float: left; width: 50%; overflow: hidden; -ms-text-overflow: ellipsis;text-overflow: ellipsis; white-space: nowrap; padding: 20px 15px; border-right: 1px solid #7f7c7c; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; font-size: 14px; padding-right: 90px;}
.main-notice li .date{position: absolute; top: 19px; right: 10px; color: #969595; }

.main-intro{text-align: center; padding: 3vw 0; max-width: 1180px; margin: 0 auto; background: #FFF;}
.main-intro h2{font-size: 31px; vertical-align: middle; background: #FFF; font-weight: 600; position: relative;}
.main-intro h2 img{vertical-align: middle; margin-bottom: 5px; margin-right: 10px;}
.main-intro h2:after{content:'';display: block; width: 3vw; height: 1px; background: #000; margin: 1.5vw auto 2.5vw; }
.main-intro p{font-size: 1.1vw; font-size: 20px; width: 80%; margin: 0 auto; word-break: keep-all; line-height: 1.5; color: #3a3a3a;}
.main-intro .img-box{margin: 3vw 0;}

.main-gallery{background: url(/asset/images/main/galleryBg.jpg) 50% 50% / cover no-repeat; text-align: center; padding: 3vw 0;}
.main-gallery h2{ font-size: 31px; vertical-align: middle; font-weight: 600; position: relative; color: #FFF;}
.main-gallery h2:after{content:'';display: block; width: 3vw; height: 1px; background: #FFF; margin: 1vw auto 1vw; }
.main-gallery p{color: #FFF;}
.main-gallery ul{max-width: 1180px; margin: 55px auto 0;}
.main-gallery ul:after{content:'';clear: both;display: block;}
.main-gallery li{display: inline-block; vertical-align: top; margin: 0 5px; border: 1px solid #FFF; -webkit-box-sizing: border-box; box-sizing: border-box; width: 23%;}
.main-gallery li a{display: block;}
.main-gallery li img{vertical-align: top; max-width: 100%;}

.main-review{text-align: center; padding: 3vw 0; background: #FFF;}
.main-review h2{ font-size: 31px; vertical-align: middle; font-weight: bold; position: relative; color: #27812f;}
.main-review h2:after{content:'';display: block; width: 3vw; height: 1px; background: #7f7f7f; margin: 1vw auto 1vw; }
.main-review p{color: #7f7f7f;}
.main-review .bx-wrapper{
  border: none;
  box-shadow: none;
  margin-top: 40px;
  margin-bottom: 0;
}
.main-review li{ padding: 30px 40px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.main-review li p.title{font-size: 30px; font-weight: bold; color: #000; margin-bottom: 10px;}
.main-review li p{font-size: 24px; color: #7f7f7f; line-height: 1.2;}
.main-review .star{padding-top: 20px;}
.main-review .star span{display: inline-block; width: 1.5em; height: 1.5em; background: url(/asset/images/main/starf.jpg) 50% 50% / 100% no-repeat; margin-right: 5px;}
.main-review .star span.no{background: url(/asset/images/main/star.jpg) 50% 50% / 100% no-repeat;}

.main-review .btn-box a{display: inline-block; border-radius: 10px; color: #FFF; padding: 12px 35px; vertical-align: middle;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#27812f+0,27812f+50,368a3e+51,368a3e+100 */
  background: #27812f; /* Old browsers */
  background: -moz-linear-gradient(top, #27812f 0%, #27812f 50%, #368a3e 51%, #368a3e 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #27812f 0%,#27812f 50%,#368a3e 51%,#368a3e 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #27812f 0%,#27812f 50%,#368a3e 51%,#368a3e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27812f', endColorstr='#368a3e',GradientType=0 ); /* IE6-9 */
  transition: all .5s ease-in;
}
.main-review .btn-box a:hover{
  background: #27812f;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#27812f+0,27812f+50,368a3e+51,368a3e+100 */
  background: #27812f; /* Old browsers */
  background: -moz-linear-gradient(top, #27812f 0%, #27812f 50%, #27812f 51%, #27812f 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #27812f 0%,#27812f 50%,#27812f 51%,#27812f 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #27812f 0%,#27812f 50%,#27812f 51%,#27812f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27812f', endColorstr='#27812f',GradientType=0 ); /* IE6-9 */
}
.main-review .bx-wrapper .bx-prev{ background: url(/asset/images/main/reviewLeft.jpg) 0 0 no-repeat; width: 25px; height: 44px;}
.main-review .bx-wrapper .bx-next{ background: url(/asset/images/main/reviewRight.jpg) 0 0 no-repeat; width: 25px; height: 44px;}
.main-review .bx-wrapper .bx-controls-direction a:hover,
.main-review .bx-wrapper .bx-next:hover,
.main-review .bx-wrapper .bx-next:focus{opacity: .8; background-position: 0 0;}

.main-review .bx-has-controls-direction{
  position: absolute; top: 50%; left: 50%; margin-top: -16px;
  width: 100%; max-width: 1180px; margin-left: -590px;
}

footer{background: #252525;}
.footer-wrap{ max-width: 1180px; margin: 0 auto; color: #FFF; padding: 30px 0; font-size: 14px; line-height: 1.5; background: url(/asset/images/footerLogo.png) 100% 30px no-repeat;}
.footer-wrap:after{content:'';clear: both;display: block;}
.footer-wrap .addr,
.footer-wrap .sns{float: left;}

.footer-wrap .addr{margin-right: 50px;}
.footer-wrap .footer-title{font-size: 15px; margin-bottom: 5px; color: #FFF;}
.footer-wrap p{color: #afafaf;}

.footer-wrap .sns ul:after{ content:'';clear: both;display: block;}
.footer-wrap .sns li{float: left; margin-right: 5px;}

footer .copyright{max-width: 1180px; margin: 0 auto; border-top: 1px solid #474747; padding: 30px 0; text-align: center; color: #afafaf; font-size: 12px;}

div.sub{ position: relative; background: #FFF; }
.sub-header{
  -webkit-background-size: cover;
  background-size: cover;
  background-position: 50% 50%;
  padding: 55px 0 0px; text-align: center;
  position: relative;
}
.sub-header h2,
.sub-header .page-nav{position: relative; color: #FFF;}
.sub-header > div{background: #000;opacity: .3; position: absolute; top:0;left:0;width: 100%; height: 100%;}
.sub-header h2{font-size: 34px; margin-bottom: 15px;}
.sub-header .page-nav{font-size: 15px; margin-bottom: 40px;}
.sub-header .page-nav a{display: inline-block; margin: 0 5px;}
.sub-header .page-nav a:nth-child(1) img{width: 16px; vertical-align: middle; margin-top: -5px;}

.sub-nav{/*background: #27812f;*/ background: rgba(39,129,47,.6); position: relative; }
.sub-nav ul{ max-width: 1180px; margin: 0 auto; color: #FFF;}
.sub-nav ul:after{content:'';clear: both;display: block;}
.sub-nav ul.nomenu li{width: 100%; background: #FFF;}
.sub-nav ul.four li{width: 25%;}
.sub-nav li{
  float: left; width: 50%; text-align: center;
  -webkit-box-sizing: border-box;box-sizing: border-box;
}
.sub-nav li a{display: block; padding: 18px 0; font-size: 16px; border-right: 1px solid #3f9046; background: #27812f; transition: all .2s ease-in;}
.sub-nav li:nth-child(1) a{border-left: 1px solid #3f9046;}
.sub-nav li.active a{background: #FFF; color: #27812f;}
.sub-nav li:not(.active):hover a{opacity: .8;}

.intro .sub-header{background-image: url(/asset/images/intro/bg01.jpg);}

.sub .content{ max-width: 1180px; margin: 0 auto; padding: 60px 0; }
.sub .content h3.page-title{text-align: center; position: relative; margin-bottom: 50px; font-size: 24px; font-weight: bold;}
.sub .content h3.page-title:after{
  content:'';display: block;
  position: absolute; left: 50%; bottom: -15px; margin-left: -15px;
  width: 30px; height: 1px;
  background: #666;
}
.intro article p{word-break: keep-all; font-size: 16px;}
.intro article{padding: 0 20px; }
.intro .content p{font-size: 16px; margin: 1em 0;line-height: 1.5; }

.intro-bold{font-family: 'Nanum Myeongjo', serif;
 font-size: 30px; color: transparent; width: 80%; margin: 20px auto; text-align: center; padding: 100px 0; background: url(/asset/images/intro/highlight.jpg) 50% 50% / 100% no-repeat;}
.intro-bold span{display: none; font-size: 70px; text-align: left;}
.intro-bold span:last-child{text-align: right;}

.sub .intro-wrap p{width: 80%; margin: 1em auto;}
.intro-wrap p.right{font-family: 'Nanum Myeongjo', serif; text-align: right; font-size: 20px; }

.air .sub-header{background-image: url(/asset/images/air/bg.jpg);}

.airwrap{display: table; padding-bottom: 20px;}
.airwrap:after{content:'';clear: both;display: block;}
.airwrap .left,
.airwrap .right{display: table-cell; vertical-align: middle;}
.airwrap img{display: block; margin: 0 auto; max-width: 100%;}
.airwrap p.ui-title{font-weight: bold; font-size: 21px;}
.airwrap p{margin: 1em 0; line-height: 1.5;}

.con01 .left,
.con02 .left{width: 50%;}

.con03 .left{width: 57%; text-align: left;}
.con03 .left img{display: inline;}
.con03 .left .ui-title{text-align: center;}
.con03 .right{padding-left: 20px;}
.con03 .right p:not(.ui-title){background: url(/asset/images/air/aircheck.jpg) 0 48% / auto 65% no-repeat; padding-left: 22px; margin: 0;}
.con03 .right p span{display: inline-block; border-radius: 5px; background: #f50057; color: #FFF; padding: 1px 10px;}

.con04 p.head{font-weight: bold; margin: 0;}
.con04 p.head + p{margin: 0;}
.con04 li{padding-bottom: 15px;}

.air .img-box{padding-top: 50px;}

.air .img-box,
.air .btn-box{text-align: center;}




.product .sub-header{background-image: url(/asset/images/product/bg02.jpg);}

.product-gallery ul:after{content:'';clear: both;display: block;}
.product-gallery li{float: left; width: 25%; text-align: center; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; padding-bottom: 20px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.product-gallery li:nth-child(-n+4){border-top: 1px solid #ccc;}
.product-gallery li:nth-child(4n-3){border-left: 1px solid #ccc; }
.product-gallery li:last-child{border-right: 1px solid #ccc;}
.product-gallery li p{border-bottom: 1px solid #ccc; padding-bottom: 10px;}
.product-gallery li > a{display: block; padding: 15px 15px 5px;}
.product-gallery .img-box{display: block; text-align: center; padding-bottom: 20px;}
.product-gallery .img-box img{ max-width: 100%; vertical-align: top;}

.product-gallery .btn-box{padding: 10px 15px 10px; text-align: center;}
.product-gallery .btn-box a{display: inline-block; vertical-align: top; border-radius: 5px; border:1px solid #999; padding: 7px 10px; color: #FFF; margin-right: 5px; font-size: 13px; color: #999;}
.product-gallery .btn-box a:first-child{background: #3f9046; color: #FFF; border-color: transparent;}

.product article .img-box{text-align: center;}

div.inquiry .sub-header{
  background-image: url(/asset/images/inquiry/bg.jpg);
}


.agree_form{
  width: 80%; margin: 0 auto;
  font-size: 13px; color: #666; line-height: 1.5; height: 100px; overflow-y : scroll;
  border: 1px solid #ccc; padding: 15px; background: #efefef;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.agree{text-align: center; font-size: 14px; padding: 15px 0;}

table.inquiry input::-webkit-input-placeholder,
table.inquiry select::-webkit-input-placeholder{
  color: #666;
  font-size: 14px;
  text-indent: 6px;
}
table.inquiry input:-ms-input-placeholder,
table.inquiry select:-ms-input-placeholder{
  color: #666;
  font-size: 14px;
  text-indent: 6px;
}

table.inquiry{width: 80%; margin: 0 auto;}
table.inquiry td{padding: 5px 0;}
table.inquiry .normal{width: 100%;}
table.inquiry textarea{
  font-family: 'Nanum Barun Gothic', sans-serif;
  padding: 15px 7px; height: 150px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
table.inquiry .tel1{width: 32%;}
table.inquiry .tel2{width: 33%; margin-left: 1%;}
table.inquiry .mail1{width: 30%;}
table.inquiry .mail2{ width: 35%;}

table.inquiry th{display: none;}

.inquiry .btn-box{text-align: center;}
.inquiry .btn-box a,
.inquiry .btn-box button{display: inline-block; padding: 10px 40px; text-align: center; border-radius: 5px; margin-right: 5px; outline: none; font-size: 14px;}
.inquiry .btn-box a:nth-child(1){ border: 1px solid #999; color: #666; }
.inquiry .btn-box button{ background: #27812f; color: #FFF; border: 1px solid #FFF;}


@media screen and (max-width: 1180px){

  .main-nav li a{padding: 12px 8px; font-size: 15px;}

  .main-visual .bx-controls-direction,
  .main-review .bx-has-controls-direction{
    margin-left: -50%;
  }
  .main-visual p{ font-size: 35px;}
  .main-visual p.title {font-size: 30px;}
  .main-visual li {height: 400px;}

  .main-intro .img-box{padding: 0 5%;}

  .main-review li p.title{font-size: 24px;}
  .main-review li p{font-size: 18px;}
  .main-review .star span{width: 1em; height: 1em;}

  .airwrap{display: block; width: 100%;}
  .airwrap p{font-size: 14px;}
  .airwrap .left,
  .airwrap .right{display: block; width: 95%; margin: 0 auto;}
  .airwrap div img{display: block !important; margin: 0 auto;}

  .air .btn-box img{max-width: 80%;}

  .product-gallery{width: 90%; margin: 0 auto;}
  .product-gallery li{width: 49%; margin-bottom: 1%; border-left: 1px solid #ccc;}
  .product-gallery li:nth-child(2n-1){border-left: 1px solid #ccc; margin-right: 1%;}

  footer{
    padding: 0 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .footer-wrap{ background: none; }
  .footer-wrap .footer-title{ padding-top: 15px; }

}

@media screen and (max-width: 667px){

  html, body{position: relative; width: 100%; overflow-x: hidden;}
  body{background: #222222;}

  header{background: #FFF; z-index: 99999; box-shadow: 1px 1px 2px 2px rgba(0,0,0,.3);transition: all .2s ease-in;}
  header.fixed{position: fixed; top:0; left: 0; width: 100%;}
  header.active{transform: translateX(230px); opacity: .8;}

  .mobileMenu{
    display: block; width: 230px;
    position: fixed; top: 0; left: 0; bottom: 0;
    color: #FFF; line-height: 1.5;
    font-size: 16px;
    padding: 20px 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .mobileMenu h2 a{display: block;}
  .mobileMenu h2 img{max-width: 100%;}
  .mobileMenu h2{margin-bottom: 15px;}

  .mobileMenu li{background: url(/asset/images/mright.png) 100% 50% / auto 50% no-repeat;}
  .mobileMenu li a{display: block; padding: 6px 0; border-bottom: 1px solid #303030;}


  .allWrap{position: relative; transition: all .2s ease-in; padding-top: 64px;}
  .allWrap.active{ transform: translateX(230px); opacity: .8;}
  .allWrap.active:after{
    content:'';
    position: absolute;
    width: 100%; height: 100%;
    z-index: 9998;
    top: 0; left: 0;
  }

  .main-nav > button,
  .main-nav > a{
    display: inline-block; width: 28px;
    position: absolute; top: 50%;
    padding: 0; margin-top: -14px;
    background: none; border: none; outline: none;
  }
  .main-nav button img,
  .main-nav > a img{width: 100%;}
  .main-nav .lmenu{left: 15px;}
  .main-nav .rmenu{right: 15px;}

  .top-nav{padding-top: 4px;}
  .top-nav ul{display: none;}

  .main-nav{text-align: center; padding: 8px 0;}
  .main-nav ul{display: none;}
  .logo{float: none; margin: 0 auto;}

  .main-visual p{font-size: 21px;}
  .main-visual .main-visual-content{max-width: 90%;}
  .main-visual p.title{font-size: 26px;}
  .main-visual .bx-wrapper .bx-pager{bottom: 50px;}

  .main-visual .bx-wrapper .bx-next,
  .main-visual .bx-wrapper .bx-prev{
    width: 20px; height: 36px;
    background-size: 100%;
  }

  .main-intro{padding: 30px 10px;}
  .main-intro h2 img{ width: 100px;}
  .main-intro h2{font-size: 18px;}
  .main-intro p{font-size: 15px;}

  .notice-wrap h2{display: none;}
  .main-notice ul{width: 100%;}
  .main-notice li {width: 100%; border-right: none;}
  .main-notice li:nth-child(n+2){display: none;}

  .main-gallery,
  .main-review{padding: 30px 0;}
  .main-gallery ul{margin: 30px auto 0;}
  .main-gallery li{width: 40%; margin-bottom: 10px;}

  .main-review .bx-wrapper{margin-top: 20px;}
  .main-review li p.title{font-size: 18px;}
  .main-review li p{font-size: 14px;}

  .main-review .bx-wrapper .bx-next,
  .main-review .bx-wrapper .bx-prev{
    width: 12px; height: 22px;
    background-size: 100%;
  }

  .sub-nav li a{font-size: 13px; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis;
  text-overflow: ellipsis; }
  .product-gallery .btn-box a:first-child{margin-bottom: 3%;}

}