section img{max-width: 100%}
.imgWrap{overflow:hidden;}

.main_top{background: url('//cdn.ios.co.kr/jp/village/kyoto_main_bg.jpg') 50% 50% no-repeat; height: 1000px; -webkit-background-size: cover;
background-size: cover;}
.main_tit_wrap{height: 100%;}
.main_tit{transform: translateY(100%); color: #fff; height: 300px; position: relative;}
.main_tit span{font-size: 18px; font-weight: 400; border: 1px solid; padding: 3px 10px;}
.main_tit h1{font-size: 90px; color: #fff; font-family: 'Nanum Myeongjo', serif; font-weight: 700; word-break: keep-all;}
.main_tit p{font-size: 52px;font-family: 'Nanum Myeongjo', serif; word-break: keep-all;}
.main_tit img{position: absolute; top: 0;left: 0;}
.main_tit_img{display: inline-block;  padding-left: 147px; margin-top: -92px;}
.tab {
  overflow: hidden;
  background-color: #2a3e28;
  color: #fff;
  font-family: 'Nanum Myeongjo', serif;

}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}
.tab button p{font-size: 32px;}
/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #71a831;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #71a831;
}

/* Style the tab content */
.tabcontent {display: none; border-top: none;}
#sec01{background: url('//cdn.ios.co.kr/jp/village/kyoto_sec01_bg.png') 50% 50% no-repeat; background-size: cover}
#sec01 .sec01_img img{border-radius: 50%; box-shadow: 10px 20px 30px rgba(5,5,5,0.2);}
.sec01_tit h3{font-size: 56px; margin-top: 15px; margin-bottom: 0; font-family: 'Nanum Myeongjo', serif; font-weight: 700;}
.sec01_tit h3 img{vertical-align: bottom;}
.sec01_tit span{font-family: 'Roboto'; font-weight: 700;   font-size: 14px; color: #242424;}
.sec01_txt{padding-top: 30px; font-size: 16px; font-weight: 400; word-break: keep-all; }
.sec01_txt::before{width: 50px;height: 1px; margin-bottom: 20px;background-color: #242424;content: ""; clear: both; display: block;}
.sec01_tit p:first-of-type{font-size: 30px;color: #242424; word-break: keep-all;}

/*sec02*/
#sec02 .col-sm-4:nth-child(2){border-right:1px solid #eee; border-left: 1px solid #eee;}
.sec02_tit h3{font-size: 36px; font-weight: 300; margin-top: 5px;padding-bottom: 50px; word-break: keep-all;}
.sec02_tit span{font-family: 'Roboto'; font-size: 14px; font-weight: 700; color: #242424;}
.sec02_txt h5{font-size: 20px; font-weight: 400; color: #242424; line-height: 1.4; word-break: keep-all;}
.sec02_txt span{font-family: 'Roboto'; font-weight: 700; color: #242424;font-size: 24px;padding: 15px 0 5px; display: block;    position: relative;}
.sec02_txt span::before{content: "";clear: both; display: block; width: 1px; height: 30px; background-color: #000;
    margin-top: -29px; text-align: center; position: absolute; left: 50%;}
.sec02_txt p{font-size: 14px; font-weight: 400; color: #888; padding-top: 5px; padding-top: 10px; word-break: keep-all;}

/* sec03 */
#sec03{background: url('//cdn.ios.co.kr/jp/village/sec03_bg.jpg') 50% -50px no-repeat;}
.sec03_tit h3{font-size: 58px; color: #fff;font-weight: 700; margin-top: -30px;margin-bottom: 0;}
.sec03_tit{height: 150px; text-align: center; position: relative;}
.sec03_tit::before{content:url('//cdn.ios.co.kr/jp/village/sec03_tit.png'); clear: both; display: inline-block; width: 100%; margin-top: 20px;}
.good_tit {padding-bottom: 50px;}
.good_tit h3{color: #242424; font-size: 40px; font-weight: 300; line-height: 1.3; word-break: keep-all;}
.good_tit span{font-size: 16px; color: #000;  border-radius: 30px;  border: 1px solid #242424;  padding: 5px 12px; margin: 3px; display: inline-block; font-weight: 400;}
.good_tit strong{background-color: #cee424;}
#sec03_goods_wrap{width: 80%;margin-right: auto;margin-left: auto; padding-bottom: 20px;}
#sec03_goods_wrap .col-xs-6{padding: 5px;}
.goodsWrap{border: 1px solid #eee;max-width: 400px;  display: block;transition: all ease 0.4s; background-color: #fff;}
.goodsWrap:hover{box-shadow: 5px 15px 30px rgba(5,5,5,0.1); transition: all ease 0.4s; border-color: #cee424;}
.goods_txt{padding: 10px;}
.goods_txt h5{font-size: 24px;padding: 20px 0; color: #242424; font-weight: 700; word-break: keep-all;}
.goods_txt p{padding-bottom: 20px; font-size: 14px; word-break: keep-all;}
.goods_btn{padding: 15px 5px; background-color: #cee424; cursor: pointer; word-break: keep-all;}
.goods_btn a{font-size: 14px; color: #000; font-weight: 400;}
.sec03_goods2 .good_tit strong{background-color: #b2e773;}
.sec03_goods2 .goods_btn{background-color: #9dda55;}
.sec03_goods2 .goodsWrap:hover{border-color: #9dda55;}
/*sec04*/
#sec04{background: url('//cdn.ios.co.kr/jp/village/sec04_bg.jpg') 50% -50px no-repeat; background-color: #f0f0f0;}
#sec04 .sec03_tit::before{content:url('//cdn.ios.co.kr/jp/village/sec04_tit.png');}
.sec04_goods .good_tit strong{ background-color: #f4bf84;}
.sec04_goods .goods_btn{background-color: #dfa970;}
.sec04_goods .goodsWrap:hover{border-color: #dfa970;}

.sec04_goods2 .good_tit strong{ background-color: #8c755c; color: #fff;}
.sec04_goods2 .goods_btn{background-color: #8e683f;}
.sec04_goods2 .goods_btn a{color: #fff;}
.sec04_goods2 .goodsWrap:hover{border-color: #8e683f;}

@media only screen and (max-width: 1200px) {
.main_tit_img{padding-left: 0;}
#sec03_goods_wrap{width: auto;}
.goodsWrap{width: auto;}
}
@media only screen and (max-width: 991px) {
.sec01_tit p:first-of-type{font-size: 22px;}
.sec02_txt h5{font-size: 16px;}
.main_tit_img{display: block; padding: 0; margin: 0; width: 100%;  transform: translateY(-226px);  text-align: right;}
.main_tit_img img{display: inline-block; width: 120px;}
}
@media only screen and (max-width: 767px) {
.main_tit{transform: translateY(84%);}
.main_tit h1{font-size: 42px;}
.main_tit p{font-size: 36px;}
.main_top{height: 660px;}
.tab button p{font-size: 28px;}
#sec01 .sec01_img img{width: 300px;}
.sec01_txt::before{display: none;}
.sec01_tit {text-align: center;padding-top: 20px;}
.sec01_tit p:first-of-type{font-size: 20px;color: #242424;}
.sec01_tit h3{font-size: 36px;}
.sec01_txt{padding-top: 20px;}

#sec02 .col-xs-12{padding: 20px 0;}
#sec02 .col-xs-12 img{width: 30%;  margin-top: 0;}
#sec02 .sec02_txt{display: inline-block;width: 81%; text-align: center;}
.sec02_txt span::before{display: none;}
.sec02_txt span{padding: 0;}
.sec02_tit h3{font-size: 27px; padding-bottom: 20px;}
#sec03,#sec04{background-position: 50% -80px;}
.sec03_tit h3{font-size: 42px;}
.good_tit h3{font-size: 26px;}
.goods_txt h5{font-size: 16px;}
.good_tit span{padding: 4px 7px;}

}
@media only screen and (max-width: 450px) {
.sec01_txt{font-size: 14px;}
.sec02_txt span::before{display: none;}
.sec02_txt span{padding: 0;}
}