.scroll-page{
  -webkit-overflow-scrolling : touch;
}

.motion {
	-webkit-transition: all 0.2s ease-out;
	   -moz-transition: all 0.2s ease-out;
	     -o-transition: all 0.2s ease-out;
	        transition: all 0.2s ease-out;
}
.motion1 {
	-webkit-transition: all 0.1s ease-out;
	   -moz-transition: all 0.1s ease-out;
	     -o-transition: all 0.1s ease-out;
	        transition: all 0.1s ease-out;
}




.wrap{
  position: relative;
  max-width:2200px;
  width:100%;

  text-align: center;
  box-sizing: border-box;
  background-color:#fff;
}
@media only screen and (min-width : 2200px){

}
@media only screen and (max-width : 1024px){

}
@media only screen and (max-width : 1024px){
  .wrap{
    padding-top:64px;

  }
}

.container{
  width:1400px;
  margin: 0 auto;
}

@media only screen and (max-width : 1024px){
  .container{
    width:100%;
    padding-left:10px;
    padding-right:10px;
    box-sizing: border-box;
  }
}
#header{

  width:100%;
  text-align:center;
  background-color:#fff;
  border-bottom:1px solid #dbdee4;
  box-sizing:border-box;
  z-index:5;
}
#header>.container{
  position:relative;
  display:flex;
  margin: 0 auto;
  max-width:1400px;
  width:100%;

  flex-flow: column;
  justify-content:center;
  align-items:center;
  box-sizing: border-box;

}
#header .top{
  width:100%;
  min-height:290px;
  padding-top:50px;
  padding-bottom:30px;
  text-align:center;
  background-color:#549b35;
}
#header a.logo{
  display:block;
  width:161px;
  margin: 0 auto;

}
#header .top .line{
  display:block;
  margin: 30px auto;
  width:25px;
  height:1px;
  background-color:rgba(255,255,255,0.5);

}
#header .top strong, #header .top strong>font{
  display:inline-block;
  width:100%;
  font-size:1.625rem;
  line-height:1.875rem;
  color:#fff;
  font-weight:300;
  text-align:center;
}
#header .top strong>font{
  font-weight:500;
}
#header .top>.container{
  position:relative;
  max-width:1490px;
  width:100%;
  margin:0 auto;
  background: url(../../img/headerBg.png);
  background-repeat: no-repeat;
  background-position: bottom center;
}


#header .top .tourdure{
  display:inline-block;
  position:absolute;
  top:0;
  right:50px;


}




#header .container .box {
  display:none;
  position:absolute;
  top:15px;
  right:20px;
  align-items:center;
  justify-content:center;
}
#header .container .box .telMob{
  display:inline-block;
  width:28px;
  height:28px;
  padding-top:3px;
  margin-right:10px;
  border-radius:30px;
  background-color:#235a4d;
  vertical-align:top;
  box-sizing: border-box;
}
#header .container .box .telMob>img{
  width:22px;
}

.menuTrigger,
.menuTrigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}

.menuTrigger {
  position: relative;
  width: 30px;
  height: 26px;
}

.menuTrigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #fff;
  border-radius: 3px;
}
.menuTrigger span:nth-of-type(1) {
  top: 0;
}
.menuTrigger span:nth-of-type(2) {
  top: 11.5px;
}
.menuTrigger span:nth-of-type(3) {
  bottom: 0;
}
#header .container .box a.telTrigger{
  display:flex;
  height:100%;
  /*width:30px;
  height:30px;
  margin-right:7px;
  padding-top:4px;
  text-align:center;
  border-radius:20px;
  background-color:#f15a22;*/
  margin-right:7px;
  justify-content: center;/*가로 중앙정렬*/
  align-items: center;/*세로 중앙정렬*/
}
#header .container .box a.telTrigger i{
  display:inline-block;
  width:30px;
  height:30px;
  padding-top:4px;
  text-align:center;
  border-radius:20px;
  background-color:#31427a;
  animation: 1.2s ease-out;
  animation-name: telTriggermove;
  animation-iteration-count: infinite;
}

@keyframes telTriggermove {
0% {
  /*margin-right:0px*/
  background-color:#f15a22;
}
50%{
  background-color:#f7941d;
}
100%{
  background-color:#f15a22;
}
}



#header.on{
  background-color:#fff;

}

@media only screen and (max-width : 1024px){
  #header{
    position:fixed;
    top:0;
    left:0;
    border-bottom:none;
  }
  #header>.container{
    justify-content:flex-end;
  }
  #header .top{
    min-height:64px;
    padding-top:10px;
    padding-bottom:10px;
  }
  #header .top>.container{
    background:none;
  }
  #header a.logo{
    margin: 0;
    width:65px;
    padding-top:10px;
    padding-bottom:10px;
  }
  #header .top .tourdure{
    top:16px;
    right:60px;
  }
  #header .top .tourdure>img{
    height:22px;
  }
  #header .container .box {
    display:block;
  }
  #header .top .line{
    display:none;
  }
  #header .top strong, #header .top strong>font{
    display:none;
  }
}

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



}
@media only screen and (max-width : 360px){

}

#quick, #scrollBox{
  z-index:3;
}





#nav{
  display:flex;
  width:100%;
  justify-content:center;/*가로 정렬*/
  align-items: center;/*세로 중앙정렬*/
}
#nav>li{
  position:relative;
  display:flex;
  width:16.66%;
  min-height:70px;
  justify-content: center;/*가로 중앙정렬*/
  align-items: center;/*세로 중앙정렬*/

  -webkit-transition: all 0.3s ease-out;
     -moz-transition: all 0.3s ease-out;
       -o-transition: all 0.3s ease-out;
          transition: all 0.3s ease-out;


}
/*#nav>li:first-child{
  width:135px;
}*/
#nav>li>a{
  position:relative;
  display:flex;
  width:100%;
  min-height:70px;
  font-weight:500;
  font-size:1rem;
  line-height:1.1rem;
  color:#5a5a5a;
  justify-content: center;/*가로 중앙정렬*/
  align-items: center;/*세로 중앙정렬*/
  word-break: keep-all;
  box-sizing: border-box;
}


#nav>li:hover, #nav>li.active{
  background-color:#549b35;

}
#nav>li:hover>a, #nav>li.active>a{
  color:#fff;
}

#nav>li>a>.line{
  position: absolute;
  display: inline-block;
  bottom:-1px;
  height: 1px;
  width: 0%;
  background: #235a4d;
  left:50%;
  z-index:6;
}
/*#nav .motion {
	-webkit-transition: background-color  0.3s ease-out, color 0.3s ease-out;
	   -moz-transition: background-color  0.3s ease-out, color 0.3s ease-out;
	     -o-transition: background-color  0.3s ease-out, color 0.3s ease-out;
	        transition: background-color  0.3s ease-out, color 0.3s ease-out;

}*/


#nav>li:hover>a>.line, #nav>li.active>a>.line{
  width:100% !important; left:0% !important;
}

#nav>li:not(.active)>a:before, #nav>li:not(.active)>a:after{
	content: "";
	left:0;
	bottom:-5px;
	width:100%;
	position:absolute;
	transition: all 0.5s ease;
}


#nav>li ul.depth2{
  position:absolute;
  /*
  top:110px;
  */
  top:102px;
  opacity:0;
  left:0;
  display:flex;
  width:115px;
  padding-left:10px;
  padding-right:10px;
  padding: 35px 0;
  background-color:#539b46;
  /*border-top:1px solid #fff;
  border-bottom:1px solid #e5e5e5;
  border-left:1px solid #e5e5e5;
  border-right:1px solid #e5e5e5;*/
  flex-flow:column;/*요소 세로정렬*/
  align-items:flex-start;/*세로 중앙정렬*/
  transition: all 0.3s ease;
}
#nav>li ul.depth2 li{
width:100%;
margin-top:5px;
vertical-align:top;
}
#nav>li ul.depth2 li:first-child{
  margin-top:0;
}
#nav>li ul.depth2 li>a{
display:inline-block;
position:relative;
padding:9px 0;
font-size:0.875rem;
font-weight:600;
line-height:0.938rem;
text-align: center;
color:#fff;
opacity:1;
word-break: keep-all;

}
#nav>li ul.depth2 li>a>font{
display:inline-block;
font-size:0.875rem;
font-weight:500;
line-height:0.938rem;
}

#nav>li ul.depth2 li>a:hover, #nav>li ul.depth2 li:hover>a, #nav>li ul.depth2 li.active>a{
/* color:#abcd04 !important; */
font-weight:600;
opacity:1;
}
#nav>li ul.depth2 li>a>font{
display:inline-block;
width:100%;
}

#nav>li ul.depth2 li .line{
position: absolute;
display: inline-block;
bottom:-1px;
height: 1px;
width: 0%;
/* background: #abcd04 !important; */
background: #fff !important;
left:50%;
opacity:0.7;
z-index:5;
}


#nav>li ul.depth2 li:hover .line, #nav>li ul.depth2 li.active .line{
width:100% !important; left:0% !important;
}

#nav>li ul.depth2 li:not(.active) a:before, #nav>li ul.depth2 li:not(.active) a:after{
content: "";
left:0;
bottom:-5px;
width:100%;
position:absolute;
transition: all 0.5s ease;
}














.dept2{
  position:fixed;
  display:flex ;
  top:111px;
  left:0;
  width:100%;

  /*min-height:100px;*/
  justify-content: center;/*가로 중앙정렬*/
  align-items:flex-start;;;/*세로 중앙정렬*/
  box-sizing: border-box;

  z-index:5;
}
.dept2>.container{
  display:flex ;
  max-width:1600px;
  width:100%;
  padding-right:230px;
  margin: 0 auto;
  font-size:0;
  line-height:0;
  text-align:center;
  justify-content: flex-end;/*가로 중앙정렬*/
  align-items: center;/*세로 중앙정렬*/
  box-sizing: border-box;

}
.dept2 .block{
  display:flex;
  justify-content: flex-end;
  align-items:flex-start;
}

.dept2>.container ul{
  display:flex;
  width:105px;
  margin-left:5px;
  margin-right:5px;

  padding: 25px 0;
  flex-flow:column;/*요소 세로정렬*/
  align-items:flex-start;/*세로 중앙정렬*/


}
.dept2>.container ul>li{
  width:100%;

  vertical-align:top;
}
.dept2>.container ul>li>a{
  display:inline-block;
  position:relative;
  padding:9px 0;
  font-size:0.875rem;
  font-weight:600;
  line-height:0.938rem;
  text-align: center;
  opacity:0.8;
  word-break: keep-all;

}
.dept2>.container ul>li>a>font{
  display:inline-block;
  font-size:0.875rem;
  font-weight:500;
  line-height:0.938rem;
}

.dept2>.container ul>li>a:hover, .dept2>.container ul>li:hover>a, .dept2>.container ul>li.active>a{
  /* color:#abcd04 !important; */
  font-weight:600;
  opacity:1;
}
.dept2>.container ul>li>a>font{
  display:inline-block;
  width:100%;
}

#nav .dept2 .line{
  position: absolute;
  display: inline-block;
  bottom:-1px;
  height: 1px;
  width: 0%;
  /* background: #abcd04 !important; */
  background: #539b46 !important;
  left:50%;
  z-index:5;
}
/*#nav .motion {
	-webkit-transition: background-color  0.3s ease-out, color 0.3s ease-out;
	   -moz-transition: background-color  0.3s ease-out, color 0.3s ease-out;
	     -o-transition: background-color  0.3s ease-out, color 0.3s ease-out;
	        transition: background-color  0.3s ease-out, color 0.3s ease-out;

}*/


#nav .dept2 li:hover .line, #nav .dept2 li.active .line{
  width:100% !important; left:0% !important;
}

#nav .dept2 li:not(.active) a:before, #nav .dept2 li:not(.active) a:after{
	content: "";
	left:0;
	bottom:-5px;
	width:100%;
	position:absolute;
	transition: all 0.5s ease;
}
@media only screen and (max-width : 1280px){
  #nav>li{
    margin-left:10px;
    margin-right:10px;
  }
}
@media only screen and (max-width : 1024px){
  #nav{
    display:none;
  }
}




/*모바일 메뉴*/
.mBg{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color: #000;
  opacity:0.5;
  z-index:100;
}
#mNav{
  position:fixed;
  top:0;
  right:0;
  width:280px;
  height:100%;
  padding-top:70px;
  box-sizing: border-box;
  background-color: #ffffff;
  z-index:100;
  overflow: hidden;
}
#mNav .logo{
  position:fixed;
  display: inline-block;
  top:20px;
  left:8px;
  z-index:5;
}
#mNav .logo img{
 width:160px;
}
#mNav .closeTrigger{
  position:fixed;
  display: inline-block;
  top:20px;
  right:10px;
  width:30px;
  height:30px;
  z-index:5;
}
.closeTrigger span{
  position: absolute;
  top: 47%;
  left:0;
  width: 100%;
  height: 3px;
  border-radius:2px;
  background-color: #393232;
}
.closeTrigger span:nth-child(1){
  transform: rotate(135deg) translateX(0%);
}
.closeTrigger span:nth-child(2){
  transform: rotate(45deg) translateX(0%);
}
#mNav>ul{
  display: inline-block;
  width:100%;
  border-top:1px solid #eee;
  overflow:hidden;
}
#mNav>ul>li{
  display: inline-block;
  width:280px;
  min-height:48px;
  border-bottom:1px solid #eee;
}
#mNav>ul>li:last-child{
  border-bottom:1px solid #eee;
}
#mNav>ul>li .depth2{
  width:100%;


}
#mNav>ul>li .depth2>ul{
  display:inline-block;
  width:100%;

}
#mNav>ul>li .depth2>ul>li{
  display:inline-block;
  width:100%;
  /* height:36px; */
  padding-left:0;
  background-color:#fff;
  /* padding-bottom:10px; */

}
#mNav>ul>li .depth2>ul>li:first-child{
  padding-top:5px;
  /* height:46px; */
  border-top:1px solid #eee !important;
}
#mNav>ul>li .depth2>ul>li:last-child{
  padding-bottom:5px;
  /* height:46px; */

}


#mNav>ul>li .depth2>ul>li>a{
  display: inline-block;
  width:100%;
  height:100%;
  padding-left:30px;
  line-height:30px;
  font-size:0.938rem;
  text-align:left;
  box-sizing:border-box;

}
#mNav>ul>li:hover{
  color:#202a65;
}
#mNav>ul>li>a{
  display: inline-block;
  width:100%;
  height:48px;
  padding-left:20px;
  font-weight:500;
  line-height:48px;
  text-align:left;
  font-size:1rem;
  color:#333333;
  letter-spacing:-0.01rem;
  box-sizing: border-box;
}






/*비주얼*/
.visual{
  width:100%;
  height:630px;
}

.section.visual{

}

.visual .web{
  position:relative;
  width:100%;
  height:100%;
}
.visual .mob{
  display:none;
}

.visual .text{
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  text-align:center;
  transform: translate(-50%,-50%);
  z-index:2;
}
.visual .text>strong, .visual .text>strong>font, .visual .text>p, .visual .text>p>font{
  display:inline-block;
  width:100%;
  text-align:center;
  color:#fff;
  word-break: keep-all;

}
.visual .text>strong>font{
  font-size:2.125rem;
  line-height:2.625rem;
  font-weight:500;
}
.visual .text>p{
  margin-top:40px;
  margin-bottom:40px;
}
.visual .text>p>font{
  font-size:0.938rem;
  line-height:1.313rem;
}
.visual .text a{
  display:inline-block;
  width:180px;
  padding-top:15px;
  padding-bottom:15px;
  font-size:1rem;
  line-height:1rem;
  color:#fff;
  text-align:center;
  border:1px solid #fff;
}
.visual .text a:hover{
  background-color:rgba(255,255,255,0.8);
  color:#000;
  font-weight:500;
}

.visual .visual_imgArea{
	position:absolute;
	top:0;
	left:0;
	opacity:1;
	width:100%;
	height:100%;
	text-align:center;
	-webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s;
  overflow:hidden;

}
.visual_imgArea img{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  max-width:none !important;
}
.visual .mob{
  position:relative;

}
.visual .mob .text{
  display:none;
}


@media only screen and (max-width : 1024px){
  .section.visual{
    height:auto;
  }
  .visual .web{
    display:none;
  }
  .visual .mob{
    display:block;
  }
  .visual .web .text{
    display:none;
  }
  .visual .mob .text{
    display:inline-block;
  }
  .visual .text>strong>font{
    font-size:1.563rem;
    line-height:2rem;
  }
  .visual .text>p>font{
    font-size:0.875rem;
  }
}


@media only screen and (max-width : 460px){
  .visual .text>strong>font{
    font-size:1.25rem;
    line-height:1.625rem;
  }
  .visual .text>p{
    padding-left:20px;
    padding-right:20px;
    margin-top:20px;
    margin-bottom:20px;
  }
  .visual .text>p>font{
    font-size:0.750rem;
    line-height:1.125rem;
  }
  .visual .text a{
    padding-top:10px;
    padding-bottom:10px;
  }
}
@media only screen and (max-width : 340px){
  .visual .text>p{
    padding-left:10px;
    padding-right:10px;

  }
}


#title{
  width:100%;
  text-align:center;
  margin-bottom:60px;
}
#title strong, #title span{
  display:inline-block;
  width:100%;
}
#title strong{
  font-size:2.250rem;
  line-height:2.250rem;
  font-weight:500;
  letter-spacing:-0.2rem;

}
#title span{
  margin-top:10px;
  font-size:1.125rem;
  line-height:1.375rem;
}

@media only screen and (max-width : 680px){
  #title{
    margin-bottom:40px;
  }
  #title strong{
    font-size:2rem;
    line-height:2rem;
    letter-spacing:-0.10rem;
  }
  #title span{
    font-size:1rem;
    line-height:1rem;
  }
}
@media only screen and (max-width : 460px){
  #title strong{
    font-size:1.5rem;
    line-height:1.5rem;
  }
  #title span{
    margin-top:7px;
    font-size:0.938rem;
    line-height:0.938rem;
    letter-spacing:-0.06rem;
  }
}


.product{

}
.product #title{
  margin-top:100px;
}
.product .container{
  position:relative;
  height:calc(655px + 100px);
  padding-right:calc(350px + 30px);
  padding-bottom:100px;
}
.product .right{
  position:absolute;
  top:0;
  right:0;
}
.product .title{
  display:inline-block;
  width:100%;
  margin-bottom:20px;
  font-size:1.250rem;
  line-height:1.250rem;
  font-weight:500;
  text-align:left;
}
.product .right .element{
  width:350px;
}
.product .right .element span{
  position:relative;
  display:block;
  width:100%;
  height:250px;
  border-radius:10px;
  overflow: hidden;
}
.product .right .element span:first-child{
  margin-bottom:5px;
}
.product .right .element span>img{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  max-width:none;
}
.product .right .element span:hover>img{
  transform: translate(-50%,-50%) scale(1.05);
}
.product .right .element p{
  display:block;
  margin-top:20px;
  width:100%;
  font-size:1.063rem;
  line-height:1.438rem;
  text-align: left;
  word-break: keep-all;
}
.product .left .element{
  display:flex;
  justify-content:flex-start;
  align-items: flex-start;
}
.product .left .element .blockL{
  display:block;
  width:590px;
  margin-right:20px;
  text-align:left;
}
.product .left .element.top .blockL span{
  position:relative;
  display:inline-block;
  height:250px;
  border-radius:10px;
  overflow: hidden;
}
.product .left .element.top .blockL span:nth-child(1){
  width:350px;
  margin-right:5px;
  text-align: left;
}
.product .left .element.top .blockL span:nth-child(2){
  width:225px;
}
.product .left .element.top .blockL span>img{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  max-width:none;
}
.product .left .element.top .blockL span:hover>img{
  transform: translate(-50%,-50%) scale(1.05);
}
.product .left .element.top .blockL p{
  display:block;
  margin-top:20px;
  text-align:left;
}
.product .left .element.top .blockL p>font{
  display:inline-block;
  width:100%;
  font-size:1.063rem;
  line-height:1.438rem;
  word-break:keep-all;
}
.product .left .element .blockR{
  width:400px !important;
}
.product .left .element.top .blockR strong{
  display:inline-block;
  width:100%;
  padding-top:10px;
  padding-bottom:12px;
  margin-bottom:10px;
  font-size:1.125rem;
  line-height:1.125rem;
  color:#fff;
  font-weight:400;
  text-align:center;
  border-radius:10px;
  background-color:#1a943b;
}
.product .left .element.bottom .blockL{
  margin-top:30px;
}
.product .left .element.bottom .blockL dl{
  width:100%;
}

.product .left .element.bottom .blockL dl>dd{
  position:relative;
  width:32%;
  border-radius:10px;
  margin-left:2%;
  overflow: hidden;
}
.product .left .element.bottom .blockL dl>dd strong{
  display:flex;
  width:100%;
  margin-bottom:10px;
  justify-content:flex-start;
  align-items:center;
}
.product .left .element.bottom .blockL dl>dd strong i, .product .left .element.bottom .blockL dl>dd strong font{
  display:inline-block;
}
.product .left .element.bottom .blockL dl>dd strong i{
  width:29px;
  height:29px;
  padding-top:7px;
  font-size:0.875rem;
  line-height:0.875rem;
  font-weight:600;
  text-align:center;
  color:#fff;
  font-style:normal;
  border-radius:20px;
  background-color:#1a943b;
}
.product .left .element.bottom .blockL dl>dd strong font{
  margin-left:5px;
  font-size:1.125rem;
  line-height:1.125rem;
  color:#1a943b;
}
.product .left .element.bottom .blockL dl>dd strong font>b{
  font-size:1.125rem;
  line-height:1.125rem;
  color:#1a943b;
  font-weight:600;
}
.product .left .element.bottom .blockL dl>dd:first-child{
  margin-left:0;
}
.product .left .element.bottom .blockL dl>dd div{
  position:relative;
  display:block;
  width:100%;
  height:180px;
  border-radius:10px;

  overflow:hidden;
}
.product .left .element.bottom .blockL dl>dd div>img{
  position:absolute;
  top:50%;
  left:50%;
  width:210px;
  transform: translate(-50%,-50%);
  max-width:none;
}
.product .left .element.bottom .blockL dl>dd div:hover>img{
  transform: translate(-50%,-50%) scale(1.05);
}
.product .left .element.bottom .blockR{
 margin-top:30px;
 padding-top:40px;
}
.product .left .element.bottom .blockR div{
  text-align: left;
  margin-bottom:5px;
}
.product .left .element.bottom .blockR div strong, .product .left .element.bottom .blockR div font{
  display:inline-block;
}
.product .left .element.bottom .blockR div strong{
  padding: 8px 25px;
  font-size:1.125rem;
  line-height:1.125rem;
  color:#fff;
  font-weight:500;
  border-radius:20px;
  background-color:#245925;
}
.product .left .element.bottom .blockR div font{
  width:110px;
  font-size:1.375rem;
  line-height:1.375rem;
  text-align:right;
}
@media only screen and (max-width : 1024px){
  .product .container{
    padding-right:10px;
    max-width:620px;
    height:auto;
    margin:0 auto;
    padding-bottom:60px;
    width:100%;
  }
  .product #title{
    margin-top:60px;
  }
  .product .right{
    position:relative;
    top:auto;
    right:auto;
    margin-bottom:40px;
  }
  .product .right .element{
    width:100%;
  }
  .product .right .element span{
    display:inline-block;
    width:49.5%;
    vertical-align:top;
  }
  .product .right .element span:first-child{
    margin-bottom:0;
    margin-right:1%;
  }
  .product .title{
    text-align:center;
  }
  .product .left .element{
    flex-flow: column;
  }
  .product .left .element .blockL{
    margin-right:0;
    width:100%;
  }
  .product .left .element.top .blockL span:nth-child(1){
    width:60%;
    margin-right:1%;
  }
  .product .left .element.top .blockL span:nth-child(2){
    width:39%;
  }
  .product .left .element.top .blockL p{
    text-align:center;
  }
  .product .left .element .blockL{
    margin-bottom:20px;
  }
  .product .left .element.bottom .blockL dl>dd strong{
    justify-content:center;
  }
  .product .left .element .blockR{
    width:100% !important;
    max-width:400px;
    margin: 0 auto;
  }
  .product .left .element.bottom .blockR{
    padding-top:0;
    margin-top:10px;
  }
  .product .left .element.bottom .blockR div{
    display:inline-block;
    margin: 0 10px;
  }
  .product .left .element.bottom .blockR div strong{
    padding: 6px 15px;
  }
  .product .left .element.bottom .blockR div font{
    width:auto;
    padding-left:10px;
  }
  .product .left .element.bottom .blockR{
    max-width:none;
  }
  .product .right .element p{
    text-align:center;
  }
}
@media only screen and (max-width : 680px){
  .product .right .element p{
    margin-top:15px;
    font-size:0.938rem;
    line-height:1.313rem;
    text-align:center;
  }
  .product .left .element.top .blockL p>font{
    font-size:0.938rem;
    line-height:1.375rem;
    text-align:center;
  }
  .product .left .element.bottom .blockL dl>dd strong i{
    width:24px;
    height:24px;
    padding-top:4px;
  }
  .product .left .element.bottom .blockL dl>dd strong font{
    margin-left:0;
    font-size:1rem;
    line-height:1rem;
  }
  .product .left .element.bottom .blockL dl>dd strong font>b{
    font-size:1rem;
    line-height:1rem;
  }
  .product .left .element.bottom .blockR div strong{
    font-size:1rem;
    line-height:1rem;
  }
  .product .left .element.bottom .blockR div font{
    padding-left:3px;
    font-size:1.125rem;
    line-height:1.125rem;
  }
}
@media only screen and (max-width : 460px){
  .product .right .element span>img{
    width:300px;
  }
  .product .left .element.top .blockL span>img{
    width:270px;
  }

  .product .left .element.bottom .blockL dl>dd strong{
    flex-flow: column;
  }
  .product .left .element.bottom .blockL dl>dd strong i{
    margin-bottom:5px;
  }
  .product .left .element.bottom .blockL dl>dd div{
    height:130px;
  }
  .product .left .element.bottom .blockL dl>dd div>img{
    width:140px;
  }
  .product .left .element.bottom .blockL dl>dd strong font{
    font-size:0.938rem;
    line-height:0.938rem;
    text-align:center;
  }
  .product .left .element.bottom .blockL dl>dd strong font>b{
    display:inline-block;
    width:100%;
    text-align:center;
  }
  .product .left .element.bottom .blockR div{
    margin: 0 5px;
  }
  .product .left .element.bottom .blockR div strong{
    padding: 4px 8px;
    font-size:0.875rem;
    font-weight:600;
  }
  .product .left .element.bottom .blockR div font{
    font-size:1rem;
    font-weight:600;
  }
  .product .left .element.bottom .blockL{
    margin-bottom:0;
  }
  .product .title{
    font-size:1.125rem;
    margin-bottom:15px;
  }
}
@media only screen and (max-width : 340px){
  .product .left .element.bottom .blockR div font{
    font-size:1.063rem;
    line-height:1.063rem;
  }
  .product .left .element.bottom .blockR div{
    margin: 0 3px;
  }
}



.class{
  padding-top:100px;
  padding-bottom:100px;
  background-color:#f5f3f2;
}
.class ul{
  position:relative;
  width:100%;
  text-align: left;
}
.class ul>li{
  width:32%;
  margin-left:2%;
  margin-top:70px;
}
.class ul>li:nth-child(3n-2){
  margin-left:0;
}
.class ul>li:nth-child(1), .class ul>li:nth-child(2), .class ul>li:nth-child(3){
  margin-top:0;
}
.class ul>li strong{
  display: inline-block;
    width: 100%;
    margin-bottom: 20px;
    font-size: 1.250rem;
    line-height: 1.250rem;
    font-weight: 500;
    text-align: left;
}
.class ul>li .img{
  position:relative;
  width:100%;
}
.class ul>li .img span{
  position:relative;
  display:inline-block;
  width:49.5%;
  height:240px;
  margin-left:1%;
  border-radius:10px;
  overflow:hidden;
}
.class ul>li .img span:first-child{
  margin-left:0;
}
.class ul>li .img span:nth-child(4), .class ul>li .img span:nth-child(5), .class ul>li .img span:nth-child(6){
  margin-bottom:0;
}
.class ul>li .img span img{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  max-width:none;
}
.class ul>li .img span:hover>img{
  transform: translate(-50%,-50%) scale(1.05);
}
.class ul>li .img i{
  display:inline-block;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border-radius:10px;
  border:3px solid rgba(0, 0, 0, 0);
  z-index:3;
}
.class ul>li .img span:hover>i{
  border:2px solid rgba(0, 0, 0, 1);
}
.class ul .etc{
  position:absolute;
  bottom:0;
  right:0;
  width:450px;
  height:240px;
  background: url(../../img/classBg.png) right bottom no-repeat;
}
.class ul .etc img{
  display:none;
}
.class ul .etc p{
  display:inline-block;
  width:100%;
  text-align:left;
}
.class ul .etc p>font{
  display:inline-block;
  width:100%;
  font-size:1.063rem;
  line-height:1.438rem;
}
@media only screen and (max-width : 1024px){
  .class{
    padding-top:60px;
    padding-bottom:60px;
  }
  .class ul{
    padding-bottom:300px;
    text-align:center;
  }
  .class ul>li strong{
    text-align:center;
  }
  .class ul>li .img span{
    height:20vw;
  }
  .class ul>li .img span img{
    width:23vw;
  }
  .class ul .etc{
    width:100%;
    text-align:center;
    background:none;
  }
  .class ul .etc img{
    display:inline-block;
  }
  .class ul .etc p>font{
    font-size:1rem;
    text-align:center;
  }
}
@media only screen and (max-width : 680px){
  .class ul>li{
    width:49%;
    margin-left:1%;
    margin-top:50px;
  }
  .class ul>li strong{
    margin-bottom:15px;
  }
  .class ul>li:nth-child(3){
    margin-top:50px;
    margin-left:0;
  }
  .class ul>li:nth-child(4){
    margin-left:1%;
  }
}
@media only screen and (max-width : 460px){
  .class ul>li strong{
    font-size:1.125rem;
    line-height:1.125rem;
    margin-bottom:10px;
  }
  .class ul>li .img span{
    width:100%;
    margin-left:0;
    height:38vw;
    margin-top:2%;
  }
  .class ul>li .img span:first-child{
    margin-top:0;
  }
  .class ul>li .img span img{
    width:47vw;
  }
  .class ul>li:nth-child(5){
    width:100%;
    margin-left:0;
  }
  .class ul>li:nth-child(5) .img span{
    width:49%;
    margin-left:1%;
  }
}
@media only screen and (max-width : 340px){
  .class ul .etc p>font{
    font-size:1rem;
    letter-spacing:-0.1rem;
  }
}

.tour{
  padding-top:100px;
  padding-bottom:100px;
}
.tour ul{
  width:100%;
}
.tour ul>li{
  width:23.5%;
  margin-left:2%;
  vertical-align:top;
}
.tour ul>li:first-child{
  margin-left:0;
}
.tour ul>li .img{
  position:relative;
  width:100%;
}
.tour ul>li .img span{
  position:relative;
  display:inline-block;
  width:100%;
  border-radius:10px;
  overflow:hidden;

}
.tour ul>li .img span:nth-child(1){
  height:320px;
}
.tour ul>li .img span:nth-child(2){
  height:200px;
  margin-top:5px;
}
.tour ul>li .img span img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  max-width: none;
  -webkit-transition: all 0.2s ease-out;
	   -moz-transition: all 0.2s ease-out;
	     -o-transition: all 0.2s ease-out;
	        transition: all 0.2s ease-out;
}
.tour ul>li .img span img:hover{
  transform: translate(-50%,-50%) scale(1.05);
}
.tour ul>li strong, .tour ul>li p{
  display:inline-block;
  width:100%;
  text-align: left;
  word-break: keep-all;
}
.tour ul>li strong{
  margin-top:20px;
  margin-bottom:10px;
  font-size:1.250rem;
  line-height:1.250rem;
  color:#1a943b;
  font-weight:500;
}
.tour ul>li p{
  font-size:1rem;
  line-height:1.375rem;
}
@media only screen and (max-width : 1024px){
  .tour{
    padding-top:60px;
    padding-bottom:60px;
  }
  .tour ul>li .img span:nth-child(1){
    height:23vw;
  }
  .tour ul>li .img span:nth-child(2){
    height:17vw;
  }
  .tour ul>li .img span img{
    width:30vw;
  }
}
@media only screen and (max-width : 680px){
  .tour ul>li{
    max-width:600px;
    width:100%;
    margin-left:0;
    margin-top:40px;
  }
  .tour ul>li:first-child{
    margin-top:0;
  }
  .tour ul>li .img{

  }
  .tour ul>li .img span:nth-child(1){
    width:59%;
    height:150px;
    margin-right:1%;
  }
  .tour ul>li .img span:nth-child(2){
    width:40%;
    height:150px;
  }
  .tour ul>li .img span img{
    width:58vw;
  }
  .tour ul>li strong, .tour ul>li p{
    text-align: center;
  }
  .tour ul>li strong{
    margin-top:15px;
    margin-bottom:5px;
  }
  .tour ul>li p{
    font-size: 0.938rem;
    line-height: 1.25rem;
  }
}
@media only screen and (max-width : 460px){
  .tour ul>li strong{
    font-size:1.125rem;
  }
}
@media only screen and (max-width : 340px){
  .tour ul>li .img span img{
    width:65vw;
    min-width:210px;
  }
}
.market{
  background-color:#1a943b;
  padding-bottom:100px;
}
.market #title{
  padding-top:100px;
}
.market #title strong, .market #title span{
  color:#fff;
}
.market .top{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
}

.market .top i{
  display:inline-block;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  width:30%;
  height:0.3px;
  background-color:rgba(255,255,255,1);
  z-index:1;
}
.market .top strong{
  display:flex;
  width:195px;
  height:195px;
  font-size:2.500rem;
  line-height:2.625rem;
  color:#1a943b;
  font-weight:300;
  letter-spacing:-0.15rem;
  background-color:#fff;
  border-radius:100px;
  justify-content:center;
  align-items:center;
  z-index:2;
}
.market .top strong:nth-child(2){
  margin-left:35px;
  margin-right:35px;
}
.market .top strong:nth-child(3){
  background-color:#ccff00;
}
.market .text{
  width:100%;
  margin-top:35px;
  margin-bottom:35px;
  text-align:center;
}
.market .text span, .market .text strong{
  display:inline-block;
  width:100%;
  font-size:1.500rem;
  line-height:1.750rem;
  letter-spacing:-0.1rem;
  color:#fff;
}
.market .text span{
  font-weight:300;
}
.market .text strong{
  font-weight:400;
}
.market ul{
  width:100%;
}
.market ul>li{
  width:24.25%;
  margin-left:1%;
}
.market ul>li:first-child{
  margin-left:0;
}
.market ul>li span{
  display:inline-block;
  position:relative;
  width:100%;
  height:240px;
  border-radius:10px;
  overflow: hidden;
}
.market ul>li span img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  max-width: none;
  -webkit-transition: all 0.2s ease-out;
	   -moz-transition: all 0.2s ease-out;
	     -o-transition: all 0.2s ease-out;
	        transition: all 0.2s ease-out;
}
.market ul>li span:hover img{
  transform: translate(-50%,-50%) scale(1.05);
}
.market ul>li span i{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border-radius:10px;
  border:3px solid rgba(255,255,255,0);
  z-index:2;
}
.market ul>li span:hover i{
  border:3px solid rgba(255,255,255,1);
}
.market .bottom{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:30px;
}
.market .bottom strong, .market .bottom strong>font, .market .bottom i, .market .bottom p, .market .bottom i, .market .bottom p>font{
  display:inline-block;
  text-align: left;
  word-break: keep-all;
}
.market .bottom strong{
  width:485px;
}
.market .bottom strong, .market .bottom strong>font{
  font-size:1.750rem;
  line-height:2rem;
  font-weight:400;
  color:#fff;
}
.market .bottom strong>font{
  font-weight:500;
}
.market .bottom i{
  width:5px;
  height:53px;
  margin-left:25px;
  margin-right:15px;
  background-color:rgba(255,255,255,0.3);
}
.market .bottom p{
  width:450px;
}
.market .bottom p>font{
  font-size:1rem;
  line-height:1.25rem;
  color:#fff;
}
@media only screen and (max-width : 1024px){
  .market{
    padding-bottom:60px;
  }
  .market #title{
    padding-top:60px;
  }
  .market .top i{
    width:50%;
  }
  .market .bottom{
    flex-flow: column;
  }
  .market .bottom strong, .market .bottom strong>font, .market .bottom i, .market .bottom p, .market .bottom i, .market .bottom p>font{
    text-align:center;
  }
  .market .bottom strong, .market .bottom p{
    width:100%;
  }
  .market .bottom i{
    margin-left:0;
    margin-right:0;
    margin-top:20px;
    margin-bottom:20px;
    width:30px;
    height:1px;
  }
  .market .bottom strong>font, .market .bottom p>font{
    width:100%;
  }
}
@media only screen and (max-width : 680px){
  .market .top strong{
    width:140px;
    height:140px;
    font-size:1.75rem;
    line-height:2.00rem;
  }
  .market .top strong:nth-child(2){
    margin-left:20px;
    margin-right:20px;
  }
  .market .text span, .market .text strong{
    font-size:1.25rem;
    line-height:1.5rem;
  }
  .market ul>li span{
    height:30vw;
  }
  .market ul>li span img{
    width:50vw;
  }

  .market .bottom strong, .market .bottom strong>font{
    font-size:1.5rem;
    line-height:1.75rem;
  }
  .market .bottom p>font{
    width:100%;
    font-size:0.938rem;
    line-height:1.25rem;
    font-weight:300;
  }
}
@media only screen and (max-width : 460px){
  .market .top strong{
    width:90px;
    height:90px;
    font-size:1.25rem;
    line-height:1.5rem;
    font-weight:500;
  }
  .market .top strong:nth-child(2){
    margin-left:10px;
    margin-right:10px;
  }
  .market .text span, .market .text strong{
    font-size:1.125rem;
    line-height:1.5rem;
  }
  .market ul>li{
    width:49.5%;
    margin-left:1%;
    margin-top:1%;
  }
  .market ul>li:first-child, .market ul>li:nth-child(3){
    margin-left:0;
  }
  .market ul>li:first-child, .market ul>li:nth-child(2){
    margin-top:0;
  }
  .market .bottom strong, .market .bottom strong>font{
    font-size:1.125rem;
    line-height:1.5rem;
  }
  .market .bottom p>font{
    display:inline;
    margin-right:3px;
  }
}

.introduce{
  padding-top:100px;
  padding-bottom:100px;
}
.introduce .container{
  display:flex;
  justify-content:space-between;
  align-items: flex-start;
}
.introduce .tit{
  display:inline-block;
  width:100%;
  margin-bottom:20px;
  text-align:left;
  font-size: 1.250rem;
  line-height:1.250rem;
  font-weight:500;
}
.introduce .tit2{
  display:inline-block;
  width:100%;
  font-size:0.875rem;
  line-height:0.875rem;
  text-align: left;
}
.introduce .tit.green{
  color:#1a943b;
}
.introduce .left{
  width:510px;
  min-height:300px;
}
.introduce .left dl{
  width:100%;
  text-align: left;
}
.introduce .left dl>dd{
  width:49%;
  margin-left:2%;
  margin-top:2%;
}
.introduce .left dl>dd:nth-child(2n-1){
  margin-left:0;
}
.introduce .left dl>dd:nth-child(1), .introduce .left dl>dd:nth-child(2){
  margin-top:0;
}
.introduce .left dl>dd span{
  position:relative;
  display:inline-block;
  width:100%;
  height:200px;
  border-radius:10px;
  overflow: hidden;
}
.introduce .left dl>dd span img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  max-width: none;
  -webkit-transition: all 0.2s ease-out;
	   -moz-transition: all 0.2s ease-out;
	     -o-transition: all 0.2s ease-out;
	        transition: all 0.2s ease-out;
}
.introduce .left dl>dd span:hover img{
  transform: translate(-50%,-50%) scale(1.05);
}
.introduce .left .txt{
  margin-top:30px;
  text-align: left;
}
.introduce .left .txt>p, .introduce .left .txt>p>font, .introduce .left .txt>strong, .introduce .left .txt>strong>font{
  display:inline-block;
  width:100%;
  text-align: left;
}
.introduce .left .txt>p>font{
  font-size:1.125rem;
  line-height:1.625rem;
  color:#3f3f3f;
  word-break: keep-all;
}

.introduce .left .txt>strong{
  margin-top:30px;
  margin-bottom:30px;
}

.introduce .left .txt>strong>font{
  font-size:1.500rem;
  line-height:2.125rem;
  color:#0b722a;
  font-weight:500;
  word-break: keep-all;
}

.introduce .right{
  width:815px;
  min-height:300px;

}
.introduce .right .map{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  width:100%;
}
.introduce .right .map .txt{
  width:350px;
}
.introduce .right .map .txt .ele{
  width:100%;
  margin-top:30px;
  text-align: left;
}
.introduce .right .map .txt .ele strong{
  display:inline-block;
  padding-bottom:10px;
  padding-right:8px;
  margin-bottom:10px;
  font-size:1.063rem;
  line-height:1.063rem;
  font-weight:500;
  border-bottom:1px solid #cccccc;
}
.introduce .right .map .txt .ele span{
  display:inline-block;
  width:100%;
  padding-bottom:8px;
  font-size:1rem;
  line-height:1rem;
  text-align: left;
}

.introduce .right .map .txt .ele span>font{
  padding-right:5px;
  font-size:1rem;
  line-height:1rem;
  font-weight:700;
}
.introduce .right .map .txt .ele>div{
  position:relative;
  width:100%;
  padding-left:50px;
}
.introduce .right .map .txt .ele>div i{
  position:absolute;
  top:0;
  left:0;
  width:43px;
  height:43px;
}
.introduce .right .map .txt .ele>div b{
  display:inline-block;
  width:100%;
  margin-bottom:6px;
  text-align:left;
  font-size:1rem;
  line-height:1rem;
  font-weight:500;
}


.introduce .right .map .img{
}


.introduce .right .qna{
  margin-top:40px;
}
.introduce .right .qna ul{
  width:100%;
  border-top:1px solid #7f7f7f;
}
.introduce .right .qna ul>li{
  width:100%;
  border-bottom:1px solid #7f7f7f;
}
.introduce .right .qna ul>li a.question{
  position:relative;
  display:inline-block;
  width:100%;
  padding-top:15px;
  padding-bottom:15px;
  padding-left:80px;
  text-align:left;
}
.introduce .right .qna ul>li a.question i{
  position:absolute;
  display:flex;
  justify-content:center;
  align-items:center;
  top:15px;
  left:0;
  width:80px;
  font-size:1.25rem;
  line-height:1.25rem;
  font-weight:800;
  font-style:normal;
}
.introduce .right .qna ul>li a.question strong{
  display:flex;
  width:100%;
  height:100%;
  font-size:1.188rem;
  line-height:1.375rem;
  font-weight:400;
  justify-content:flex-start;
  align-items:center;
}
.introduce .right .qna ul>li .answer{
  width:100%;
  padding-left:80px;
  padding-top:20px;
  padding-bottom:20px;
  border-top:1px solid #ccc;
  font-size:1.125rem;
  line-height:1.563rem;
  color:#555;
  text-align:left;
  word-break: keep-all;
}
.introduce .right .move{
  margin-top:80px;
}
.introduce .right .move ul{
  width:100%;
}
.introduce .right .move ul>li{
  width:19.2%;
  margin-left:1%;
  vertical-align:top;
}
.introduce .right .move ul>li:first-child{
  margin-left:0;
}
.introduce .right .move ul>li span{
  position:relative;
  display:inline-block;
  width:100%;
  height:180px;
  border-radius:10px;
  overflow:hidden;
}
.introduce .right .move ul>li span img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width:170px;
  max-width: none;
  -webkit-transition: all 0.2s ease-out;
	   -moz-transition: all 0.2s ease-out;
	     -o-transition: all 0.2s ease-out;
	        transition: all 0.2s ease-out;
}
.introduce .right .move ul>li span:hover img{
  transform: translate(-50%,-50%) scale(1.05);
}
.introduce .right .move ul>li strong{
  display:inline-block;
  width:100%;
  margin-top:15px;
  font-size:1rem;
  line-height:1.25rem;
  font-weight:400;
  letter-spacing:-0.1rem;
  text-align:left;
  word-break: keep-all;
}
@media only screen and (max-width : 1024px){
  .introduce{
    padding-top:60px;
    padding-bottom:60px;
  }
  .introduce .container{
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }
  .introduce .tit{
    text-align:center;
  }
  .introduce .left, .introduce .right{
    max-width:600px;
    width:100%;
  }
  .introduce .left .txt>p, .introduce .left .txt>p>font, .introduce .left .txt>strong, .introduce .left .txt>strong>font{
    text-align:center;
  }
  .introduce .right{
    margin-top:50px;
  }
  .introduce .right .map{
    flex-flow:column;
  }
  .introduce .right .map .txt{
    width:100%;
  }
  .introduce .tit2{
    text-align:center;
  }
  .introduce .right .map .txt .ele{
    text-align:center;
  }
  .introduce .right .map .txt .ele span{
    text-align:center;
  }
  .introduce .right .map .txt .ele>div{
    width:230px;
    margin: 0 auto;
  }
  .introduce .right .map .img{
    width:100%;
    margin-top:20px;
    text-align:center;
  }
  .introduce .right .move ul>li strong{

    text-align:center;
  }
  .introduce .right .map .txt .ele strong{
    padding-left:5px;
    padding-right:5px;
  }
}
@media only screen and (max-width : 680px){
  .introduce .left .txt>p>font{
    font-size:1.063rem;
    line-height:1.438rem;
  }
  .introduce .left .txt>strong{
    margin-top:25px;
    margin-bottom:25px;
  }
  .introduce .left .txt>strong>font{
    font-size:1.25rem;
    line-height:1.563rem;
  }
  .introduce .right .qna ul>li a.question, .introduce .right .qna ul>li .answer{
    padding-left:60px;
  }
  .introduce .right .qna ul>li a.question i{
    top:17px;
    width:50px;
    font-size:1.063rem;
    line-height:1.063rem;
  }
  .introduce .right .qna ul>li a.question strong{
    font-size:1.063rem;
    line-height:1.313rem;
  }
  .introduce .right .qna ul>li .answer{
    font-size:1.063rem;
    line-height:1.438rem;
  }
  .introduce .right .move ul>li{
    width:32%;
    margin-left:2%;
    margin-top:5%;
  }
  .introduce .right .move ul>li:nth-child(1), .introduce .right .move ul>li:nth-child(2), .introduce .right .move ul>li:nth-child(3){
    margin-top:0;
  }
  .introduce .right .move ul>li:nth-child(3n-2){
    margin-left:0;
  }
  .introduce .right .move ul>li span{
    height:26vw;
  }
  .introduce .right .move ul>li span img{
    width:30vw;
  }
  .introduce .right .move ul>li strong{
    font-size:0.938rem;
    letter-spacing:-0.08rem;
  }
}
@media only screen and (max-width : 460px){
  .introduce .tit{
    font-size:1.125rem;
    margin-bottom:15px;
  }
  .introduce .left .txt{
    margin-top:20px;
  }
  .introduce .left .txt>p>font{
    display:inline;
    padding-right:3px;
    font-size: 0.938rem;
    line-height: 1.313rem;
  }
  .introduce .left .txt>strong>font{
    font-size: 1.125rem;
    line-height: 1.438rem;
  }
  .introduce .right .map .txt .ele span{
    padding-bottom:5px;
  }
  .introduce .right .map .txt .ele span>font, .introduce .right .map .txt .ele span{
    font-size:0.938rem;
  }
  .introduce .right .map .txt .ele>div b{
    font-size:0.938rem;
  }
  .introduce .right .qna ul>li a.question, .introduce .right .qna ul>li .answer{
    padding-left:50px;
  }
  .introduce .right .qna ul>li a.question i{
    top:18px;
    font-size:1rem;
  }
  .introduce .right .qna ul>li a.question strong, .introduce .right .qna ul>li .answer{
    font-size:0.938rem;
    line-height:1.313rem;
  }
  .introduce .right .qna ul>li .answer{
    padding-top:15px;
    padding-bottom:15px;
    background-color:#f1f1f1;
  }
  .introduce .right .map .txt .ele strong{
    font-size:1rem;
    padding-bottom:6px;
  }
}
@media only screen and (max-width : 360px){
  .introduce .right .map .txt .ele span>font, .introduce .right .map .txt .ele span{
    letter-spacing:-0.1rem;
  }
}

.story{
  background-color:#f5f3f2;
  padding-bottom:100px;
}
.story #title{
  padding-top:100px;
}
.story a.more{
  position:absolute;
  top:-50px;
  right:0;
  display:inline-block;
  width:36px;
  height:36px;
  border-radius:30px;
  background-color:#fff;
  border:1px solid #bbb;
}
.story a.more span:nth-child(1){
  position:absolute;
  top:50%;
  left:50%;
  width:15px;
  height:0.5px;
  transform: translate(-50%,-50%);
  background-color:#666;
}
.story a.more span:nth-child(2){
  position:absolute;
  top:50%;
  left:50%;
  width:0.5px;
  height:15px;
  transform: translate(-50%,-50%);
  background-color:#666;
}
.story a.more:hover{
  border:1px solid #1a943b;
  background-color:#1a943b;
}
.story a.more:hover span{
  background-color:#fff;
}
.story ul{
  position:relative;
  width:100%;
  text-align: left;
}
.story ul>li{
  width:49%;
  margin-left:2%;
  margin-top:2%;
  border-radius:5px;
  border:1px solid #d0cfce;
  background-color:#fff;
  vertical-align:top;
}
.story ul>li:nth-child(2n-1){
  margin-left:0;
}
.story ul>li:nth-child(1), .story ul>li:nth-child(2){
  margin-top:0;
}
.story ul>li:hover{
  border:1px solid #1a943b;
  box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
}
.story ul>li>a{
  display:inline-block;
  width:100%;
  height:100%;
  padding:40px 30px;
}
.story ul>li strong, .story ul>li p{
  display:inline-block;
  width:100%;
  text-align:left;
}
.story ul>li strong{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.story ul>li strong, .story ul>li strong>font{
  font-size:1.250rem;
  line-height:1.250rem;
  color:#1a943b;
  font-weight:500;
}
.story ul>li strong>font{
  margin-right:3px;
}
.story ul>li p{
  margin-top:15px;
  font-size:0.938rem;
  line-height:1.25rem;
  white-space: normal;
  height: 40px;
  text-align: left;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}
.story ul>li div{
  display:flex;
  margin-top:10px;
  justify-content: flex-start;
  align-items:center;
}
.story ul>li div b, .story ul>li div i, .story ul>li div span{
  display:inline-block;
}
.story ul>li div b, .story ul>li div span{
  font-size:0.750rem;
  line-height:0.750rem;
  font-weight:800;
}
.story ul>li div i{
  margin-left:8px;
  margin-right:8px;
  width:22px;
  height:12px;
  padding-top:5px;
  background-color:#1a943b;
  text-align:center;
}
@media only screen and (max-width : 1024px){
  .story{
    padding-bottom:60px;
  }
  .story #title{
    padding-top:60px;
  }
  .story ul>li>a{
    padding:20px 20px;
  }
  .story a.more{
    display:none;
  }

}
@media only screen and (max-width : 680px){
  .story ul>li{
    width:100%;
    margin-left:0;
  }
  .story ul>li:nth-child(2){
    margin-top:2%;
  }
}
@media only screen and (max-width : 460px){
  .story ul>li strong, .story ul>li strong>font{
    font-size:1rem;
    line-height:1rem;
  }
  .story ul>li p{
    margin-top:10px;
    height:36px;
    font-size:0.875rem;
    line-height:1.125rem;
  }
}



/*푸터*/
#footer{
  border-top:1px solid #d9d9d8;
  padding-top:50px;
  padding-bottom:50px;

}
#footer .container{
  position:relative;
  display:flex;
  max-width:1400px;
  width:100%;
  justify-content:flex-start;
  align-items: flex-start;/*세로 중앙정렬*/
}
#footer a.logo{
  display:flex;
  width:85px;
  margin-right:20px;
  align-items: center;
  justify-content:flex-start;

}
#footer a.logo>img{
  width:118px;
}
#footer .box{
  display:flex;
  margin-right:10px;
  flex-flow: column;
  align-items:flex-start;
  justify-content:center;
}
#footer .box strong{
  display:inline-block;
  margin-right:10px;
  font-size:1.125rem;
  line-height:1.125rem;
  color:#235a4d;
}
#footer .box dl{

}
#footer .box dl>dd{
  margin-right:5px;
}
#footer .box dl>dd, #footer .box dl>dd>b, #footer .box dl>dd>a{
  display:inline-block;
  font-size:0.750rem;
  line-height:0.750rem;
  font-weight:500;
}
#footer .box dl>dd>b{
  font-weight:600;
}
#footer .box span{
  display:inline-block;
  margin-top:3px;
  font-size:0.750rem;
  line-height:0.750rem;
  font-weight:600;
}
#footer a.instar{
  display:flex;
  justify-content:flex-start;
  align-items: center;
}
#footer a.instar>span{
  display:inline-block;
  margin-left:3px;
  font-size:0.813rem;
  line-height:0.813rem;
  font-weight:500;
}
#footer .box  .copy{
  display:inline-block;
  width:100%;
  margin-top:5px;
  text-align:left;
  font-size:0.625rem;
  line-height:0.625rem;
  font-weight:800;
  font-style:normal;
}
#footer dl.banner{
  position:absolute;
  top:0;
  right:0;
}
#footer dl.banner>dd{
  margin-left:15px;
}
#footer dl.banner>dd:first-child{
  margin-left:0;
}

@media only screen and (max-width : 1024px){
  #footer{
    padding-top:30px;
    padding-bottom:30px;
  }
  #footer .container{
    flex-flow:column;
    justify-content:center;
    align-items:center;
  }
  #footer a.logo{
    margin-right:0;
    flex-flow:column;
  }
  #footer a.logo>img{
    width:80px;
  }
  #footer .box{
    flex-flow:column;
    margin-top:15px;
    margin-bottom:15px;
  }
  #footer .box strong{
    margin-right:0;
    margin-bottom:5px;
  }
  #footer .box i.line{
    display:none;
  }
  #footer .box dl{
    text-align:center;
  }
  #footer .box dl>dd{
    width:100%;
    margin-top:5px;
    font-size:0.813rem;
  }
  #footer .box span{
    margin-top:7px;
  }
  #footer .box dl>dd>font{
    font-size:0.813rem;

  }
  #footer .box dl>dd::after{
    display:none;
  }
  #footer .box span{
    width:100%;
    text-align:center;
  }
  #footer .box .copy{
    text-align:center;
    margin-top:8px;
  }
  #footer dl.banner{
    position:relative;
    top:auto;
    right:auto;
    margin-top:15px;
    width:100%;
    text-align:center;
  }
    #footer dl.banner>dd{
      margin-left:13px;
    }
  #footer dl.banner img{
    height:34px;
  }
}







#subTitle{
  display:flex;
  width:100%;
  height:200px;
  background:url(../../img/subTitleBg.jpg) center center no-repeat;
  background-size:cover;
  align-items:center;
  justify-content:center;
  flex-flow: column;
}
#subTitle i{
  display:block;
  width:20px;
  height:1px;
  margin-bottom:10px;
  background-color:rgba(255,255,255,0.6);
}
#subTitle strong{
  display:block;
  font-size:2.250rem;
  line-height:2.250rem;
  color:#fff;
  font-weight:200;
}
#subTitle strong>font{
  font-size:2.250rem;
  line-height:2.250rem;
  font-weight:500;
}
@media only screen and (max-width : 1024px){

}
@media only screen and (max-width : 680px){
  #subTitle{
    height:160px;
  }
  #subTitle strong, #subTitle strong>font{
    font-size:1.75rem;
    line-height:2.250rem;
  }
}



#container{
  position:relative;
  padding-top:80px;
}
@media only screen and (max-width : 1024px){
  #container{
    padding-top:0;
  }
}


.subTit{
  display:flex;
  width:100%;

  margin-bottom:45px;
  align-items:center;
  justify-content:center;
  flex-flow: column;
}
.subTit i{
  display:block;
  width:28px;
  height:1px;
  margin-bottom:25px;
  background-color:#549b35;
}
.subTit strong, .subTit span{
  display:inline-block;
  width:100%;
  text-align:center;
}
.subTit strong{
  font-size:2.125rem;
  line-height:2.125rem;
  font-weight:500;
  letter-spacing:-0.15rem;
  color:#2d2c2c;
}

@media only screen and (max-width : 1024px){
  .subTit{
    display:flex;
    width:100%;
    margin-top:70px;
    margin-bottom:30px;
  }
  .subTit strong{
    font-size:2rem;
    line-height:2rem;
    letter-spacing:-0.10rem;
  }
  .subTit i{
    margin-bottom:15px;
  }
  .subTit span{

  }
}
@media only screen and (max-width : 460px){
  .subTit strong{
    font-size:2rem;
    line-height:2rem;
  }
  .subTit span{
    font-size:1.375rem;
    line-height:1.375rem;
  }
}




.content{
  max-width:1400px;
  width:100%;
  margin: 0 auto;
  margin-top:60px;
  margin-bottom:100px;
}
.content .web{
  display:block;
}
.content .mob{
  display:none;
}
@media only screen and (max-width : 1024px){
  .content{
    width:100%;
    padding-left:10px;
    padding-right:10px;
    margin-bottom:70px;
    margin-top:30px;
    box-sizing: border-box;
  }
  .content .web{
    display:none;
  }
  .content .mob{
    display:block;
  }
}





ul.tab{
  display:flex;
  max-width:1200px;
  width:100%;
  margin: 0 auto;
  margin-bottom:50px;
  justify-content: center;/*가로 정렬*/
  align-items:top;/*세로 정렬*/
}
ul.tab>li{
  position:relative;
  width:24.25%;
  height:60px;
  margin-left:1%;
  text-align: center;
  border:5px solid #539b46;
  opacity:0.2;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease-out;
     -moz-transition: all 0.2s ease-out;
       -o-transition: all 0.2s ease-out;
          transition: all 0.2s ease-out;
}
ul.tab>li:first-child{
  margin-left:0;
}
ul.tab>li:hover, ul.tab>li.active{
  border:5px solid #539b46;
  opacity:1;
}
ul.tab>li a{
  display:inline-block;
  width:100%;
  height:100%;
}
ul.tab>li font{
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  display:inline-block;
  font-size:1.125rem;
  line-height:1.125rem;
  color:#333;
  word-break: keep-all;
  -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
  -webkit-transition: all 0.2s ease-out;
     -moz-transition: all 0.2s ease-out;
       -o-transition: all 0.2s ease-out;
          transition: all 0.2s ease-out;
}
ul.tab>li.long>a{
  letter-spacing:-0.1rem;
}
ul.tab>li:hover>a, ul.tab>li.active>a{
  color:#539b46;

}
ul.tab>li:hover font, ul.tab>li.active font{
  color:#000 !important;
  font-weight:500;
}


@media only screen and (max-width : 1024px){
  ul.tab>li{
    height:50px;
    border:2px solid #0d1f47;
  }
  ul.tab>li:hover, ul.tab>li.active{
    border:2px solid #0d1f47;
  }
  ul.tab>li font{
    position:absolute;
    font-size:1rem;
    line-height:1rem;
  }
}
@media only screen and (max-width : 640px){
  ul.tab{
    flex-flow: column;
  }
  ul.tab>li{
    width:100%;
    height:50px;
    margin-left:0;
    margin-top:1%;
  }
    ul.tab>li:first-child{
      margin-top:0;
    }

}





@media only screen and (min-width : 2400px){
  .wrap{
    min-width:2400px !important;
    width:2400px;
    margin: 0 auto;
    border-left:1px solid #ddd;
    border-right:1px solid #ddd;
    box-sizing: inherit;
    overflow:hidden;

  }

}


.noArticle{
  display:inline-block;
  width:100%;
  padding-top:50px;
  padding-bottom:50px;
  text-align:center;
  font-size:1.1rem;
  line-height:1.1rem;
}