/* company.css */

.intro_sec1 .inner{display: table;}
.intro_sec1 .tit_area{display:table-cell; padding: 20px 50px 40px 0; width: 50%; vertical-align: middle;}
.intro_sec1 .inner2 .tit_area{ padding: 20px 50px 40px 0; width: 50%; vertical-align: middle; display: block;}
.intro_sec1 .figure_area{display:table-cell; width: 50%; background: url(../../img/company/section1_img.jpg); background-size: cover; background-position: center;}
.intro_sec1 .figure_area img{width: 100%; display: none;}
.intro_sec2{position: relative; padding: 0;}
.intro_sec2::before{display: block; content: ""; position: absolute; width: 100%; height: 50%; top: 0; background: #fff;}
.intro_sec2::after{display: block; content: ""; position: absolute; width: 100%; height: 50%; bottom: 0; background: #f5f5f5;}
.intro_sec2 .list_area{background: #fff; position: relative; z-index: 10; border: 1px solid #ddd;}
.intro_sec2 .list_area li{float: left; padding: 40px 30px 50px 30px; width: 25%;}
.intro_sec2 .list_area li .num{display: block; margin: 0 auto; width: 40px; height: 40px; background: #fac60e; border-radius: 50%; text-align: center; line-height: 40px; color: #fff; font-size: 18px; font-weight: 700;}
.intro_sec2 .list_area li .tit{margin: 20px auto 10px; font-size: 18px; font-weight: 700; text-align: center;}
.intro_sec2 .list_area li .desc{text-align: center; font-size: 14px; line-height: 20px; color: #888;} 
.intro_sec3{background: #f5f5f5;}
.intro_sec3 .figure_area{margin-bottom: 50px;}
.intro_sec3 .figure_area img{width: 100%;}
.intro_sec3 .tit_area.subpage .parallelogram{margin-left: auto; margin-right: auto;}
.intro_sec3 .tit_area.subpage *{text-align: center;}
.intro_sec4 .tit_area.subpage .parallelogram{margin-left: auto; margin-right: auto;}
.intro_sec4 .tit_area.subpage *{text-align: center;}
.intro_sec4 .tit_area.subpage .sub_tit{margin: 35px auto 0;}
.intro_sec4 .timeline_area{margin-top: 60px;}
.intro_sec4 .timeline > ul{float: left; width: 48%;}
.intro_sec4 .timeline .right{float: right;}
.intro_sec4 .timeline_1li{float: left; margin-bottom: 40px; width: 100%;}
.intro_sec4 .timeline_1li .year_box{float: left; position: relative; width: 190px; height: 110px;}
.intro_sec4 .timeline_1li .year{background: #fac60e; width: 110px; height: 100%; border-radius: 50%; text-align: center; line-height: 110px; color: #fff; font-size: 24px;}
.intro_sec4 .left .timeline_1li:nth-child(2n) .year, .intro_sec4 .right .timeline_1li:nth-child(2n-1) .year{background: #3a3838;}
.intro_sec4 .timeline_1li .circle{float: right; display: block; position: absolute; width: 65px; height: 1px; background: #ccc; top: 50%; left: 110px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
.intro_sec4 .timeline_1li .circle::after{display: block; content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ccc; position: absolute; right: 0; top: -3px;}
.intro_sec4 .timeline_1li .detail_box{float: right; width: 64%;}
.intro_sec4 .timeline_1li .detail_box ul{float: left; width: 100%;}
.intro_sec4 .timeline_1li .detail_box li *{display: inline-block; float: left;}
.intro_sec4 .timeline_1li .detail_box li:first-child{margin-top: 43px;}
.intro_sec4 .timeline_1li .detail_box .month{color: #444; font-weight: 700; font-size: 18px; width: 20%;}
.intro_sec4 .timeline_1li .detail_box .detail{width: 80%; color: #888; font-size: 18px;}
.dir_sec1 .tit_area.subpage .parallelogram{margin-left: auto; margin-right: auto;}
.dir_sec1 .tit_area.subpage *{text-align: center;}
.dir_sec1 .dir_con{margin-top: 45px;}
.dir_sec1 .map_area{width: 100%; height: 490px;}
.dir_sec1 .map_box{height: 100%;}
.dir_sec1 .map_box .map_img{display: block; height: 100%;}
.dir_sec1 .map_box .root_daum_roughmap{width: 100%; height: 100%;}
.dir_sec1 .map_box .root_daum_roughmap .wrap_map{height: 100%;}
.roughmap_maker_label, .root_daum_roughmap .wrap_btn_zoom{display: none !important;}
.dir_sec1 .desc_area{padding: 45px 0 0;}
.dir_sec1 .desc_area ul{float: left; width: 50%;}
.dir_sec1 .desc_area .info{}
.dir_sec1 .desc_area .tit{font-size: 18px; font-weight: 700;}
.dir_sec1 .desc_area .tit::before{display: inline-block; margin: 0 25px 8px 0; content: ""; width: 45px; height: 2px; background: #fac60e;}
.dir_sec1 .desc_area li{padding-left: 70px;}
.dir_sec1 .desc_area li .tit2{margin: 20px 0 10px; font-size: 18px; font-weight: 300; word-break: keep-all;}
.dir_sec1 .desc_area li .desc{font-size: 14px; color: #666;}
.dir_sec1 .desc_area li .desc::before{display: inline-block; margin: 0 8px 5px 0; content: ""; width: 5px; height: 1px; background: #666;}
@media screen and (max-width: 1199px){
    .intro_sec2 .list_area li{padding: 35px 20px 40px 20px;}
    .intro_sec2 .list_area li .num{font-size: 16px;}
    .intro_sec2 .list_area li .tit{margin: 15px auto 10px; font-size: 16px;}
    .intro_sec2 .list_area li .desc{font-size: 13px;} 
    .intro_sec4 .tit_area.subpage .sub_tit{margin: 32px auto 0;}
    .intro_sec4 .timeline_1li{margin-bottom: 30px;}
    .intro_sec4 .timeline_1li .year_box{width: 160px; height: 100px;}
    .intro_sec4 .timeline_1li .year{width: 100px; line-height: 100px; font-size: 18px;}
    .intro_sec4 .timeline_1li .circle{width: 50px; left: 100px;}   
    .intro_sec4 .timeline_1li .detail_box li:first-child{margin-top: 38px;}
    .intro_sec4 .timeline_1li .detail_box .month{font-size: 16px;}
    .intro_sec4 .timeline_1li .detail_box .detail{font-size: 16px;}
    .dir_sec1 .dir_con{margin-top: 40px;}
    .dir_sec1 .map_area{height: 450px;}
    .dir_sec1 .desc_area{padding: 40px 0 0;}
    .dir_sec1 .desc_area ul{width: 48%;}
    .dir_sec1 .desc_area .transit{float: right;}
    .dir_sec1 .desc_area .tit{font-size: 16px;}
    .dir_sec1 .desc_area .tit::before{margin: 0 25px 6px 0; width: 40px;}
    .dir_sec1 .desc_area li{padding-left: 65px;}
    .dir_sec1 .desc_area li .tit2{margin: 15px 0 8px; font-size: 16px;}
    .dir_sec1 .desc_area li .desc{font-size: 13px;}
}
@media screen and (min-width: 768px) and (max-width:1024px){
    .intro_sec4 .timeline > ul{width: 49%;}
    .intro_sec4 .timeline_1li .year_box{width: 130px; height: 90px;}
    .intro_sec4 .timeline_1li .year{width: 90px; line-height: 90px;}
    .intro_sec4 .timeline_1li .circle{width: 40px; left: 90px;}   
    .intro_sec4 .timeline_1li .detail_box{width: 60%;}
    .intro_sec4 .timeline_1li .detail_box li:first-child{margin-top: 33px;}
    .intro_sec4 .timeline_1li .detail_box .month{width: 25%;}
    .intro_sec4 .timeline_1li .detail_box .detail{width: 75%;}  
} 
@media screen and (max-width: 767px){
    .intro_sec1 .tit_area{display:block; padding: 0; width: 100%; vertical-align: middle;}
    .intro_sec1 .figure_area{display:block; margin-top: 40px; width: 100%; background: none}
    .intro_sec1 .figure_area img{width: 100%; display: block;}
    .intro_sec2 .list_area li{width: 50%;}
    .intro_sec3 .figure_area{height: 300px;}
    .intro_sec3 .figure_area .figure{width: 100%; height: 100%; overflow: hidden;}
    .intro_sec3 .figure_area img{position: relative; width: auto; height: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);}
    .intro_sec3 .tit_area.subpage .parallelogram{margin-left: auto; margin-right: auto;}
    .intro_sec3 .tit_area.subpage *{text-align: center;}
    .intro_sec4 .timeline_area{margin-top: 40px;}
    .intro_sec4 .timeline > ul{width: 100%;}
    .intro_sec4 .timeline_1li .year_box{width: 150px;}
    .intro_sec4 .timeline_1li .circle{width: 40px;}   
    .intro_sec4 .timeline_1li .detail_box{float: left; padding-left: 20px; width: 63%;}
    .intro_sec4 .timeline_1li .detail_box li{overflow: hidden;}
    .intro_sec4 .timeline_1li .detail_box li:first-child{margin-top: 38px;}
    .intro_sec4 .timeline_1li .detail_box .month{width: 65px;}
    .intro_sec4 .timeline_1li .detail_box .detail{width: 73%;} 
    .dir_sec1 .map_area{height: 400px;}
    .dir_sec1 .desc_area ul{margin-bottom: 30px; width: 100%;}
}
@media screen and (max-width:480px){
    .intro_sec2 .list_area li{padding: 30px 20px; width: 100%;}
    .intro_sec2 .list_area li .num{font-size: 14px;}
    .intro_sec2 .list_area li .tit{font-size: 14px;}
    .intro_sec2 .list_area li .desc{font-size: 12px; line-height: 18px;} 
    .intro_sec3 .figure_area{height: 260px;}
    .intro_sec4 .tit_area.subpage .sub_tit{margin: 30px auto 0;}
    .intro_sec4 .timeline_area{margin-top: 35px;}
    .intro_sec4 .timeline_1li .year_box{width: 115px; height: 80px;}
    .intro_sec4 .timeline_1li .year{width: 80px; line-height: 80px; font-size: 16px;}
    .intro_sec4 .timeline_1li .circle{width: 30px; left: 80px;}   
    .intro_sec4 .timeline_1li .detail_box{float: left; padding-left: 10px; width: 65%;}
    .intro_sec4 .timeline_1li .detail_box li:first-child{margin-top: 28px;}
    .intro_sec4 .timeline_1li .detail_box .month{width: 45px; font-size: 14px;}
    .intro_sec4 .timeline_1li .detail_box .detail{width: 79%; font-size: 14px;} 
    .dir_sec1 .dir_con{margin-top: 30px;}
    .dir_sec1 .map_area{height: 300px;}
    .dir_sec1 .desc_area{padding: 30px 0 0;}
    .dir_sec1 .desc_area ul{margin-bottom: 20px;}
    .dir_sec1 .desc_area .tit{font-size: 15px;}
    .dir_sec1 .desc_area .tit::before{margin: 0 15px 6px 0; width: 25px;}
    .dir_sec1 .desc_area li{padding-left: 40px;}
    .dir_sec1 .desc_area li .tit2{margin: 15px 0 5px; font-size: 14px;}
    .dir_sec1 .desc_area li .desc{font-size: 12px;}   
}
@media screen and (max-width: 400px){
    .intro_sec4 .timeline_1li .year_box{float: none; margin: 0 auto; width: 80px; height: 115px;}
    .intro_sec4 .timeline_1li .year{height: 80px;}
    .intro_sec4 .timeline_1li .circle{width: 1px; height: 30px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); top: 80px;}
    .intro_sec4 .timeline_1li .circle::after{top:30px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);}
    .intro_sec4 .timeline_1li .detail_box{padding: 0; width: 100%;}
    .intro_sec4 .timeline_1li .detail_box ul{position: relative; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: auto; min-width: 282px;}
    .intro_sec4 .timeline_1li .detail_box li:first-child{margin-top: 20px;}
    .intro_sec4 .timeline_1li .detail_box .month{width: 15%;}
    .intro_sec4 .timeline_1li .detail_box .detail{width: 85%;}
}







.tab-area {
  margin:0px auto;
  max-width:1400px;
  margin-bottom: 100px;

}
.tab-menu {
  overflow:hidden;
}
.tab-menu a {
  float:left;
  width:50%;
  height:50px;
  background-color:#f5f5f5;
  color:#000;
  text-align:center;
  text-decoration:none;
  font-size:16px;
  line-height:50px;
  font-weight: 600;
}
.tab-menu a:first-child {
  border-left:0;
}
.tab-menu a.on {
  background-color:#BD8BCA;
  color:#fff;
}
.hidden-area {
  display:none;
  background:#f5f5f5;
  text-align:center;
  font-size:20px;
}
.hidden-area.on {
  display:block;
}

.en_kit_cont{
	padding: 50px 0;
}

.en_kit_cont ul:after{
	content: '';
	display: block;
	clear: both;
}

.en_kit_cont ul{
	width: 100%;
}

.en_kit_cont ul li{
	padding: 0 30px;
	width: 50%;
	float: left;
	margin-bottom: 80px;
}

.en_kit_cont ul li .thumb{
	margin-bottom: 30px;
}

.en_kit_cont ul li .thumb .pro_img{
	width: 100%;
}

.en_kit_cont ul li .thumb .pro_img img{
	width: 100%;
}

@media(max-width:690px){
	.en_kit_cont ul li{
		width: 80%;
		float: none;
		margin : 30px auto;
		padding: 0;
	}
}

.en_kit_cont ul li .pro_ex p strong{
	display: block;
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 20px;
}

.en_kit_cont ul li .pro_ex span{
	display: block;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 20px;
}

.en_kit_cont ul li .pro_ex p{
	display: block;
	font-size: 24px;
	font-weight: 600;
}



.lrp_kit_cont{
	padding: 50px 0;
}

.lrp_kit_cont ul:after{
	content: '';
	display: block;
	clear: both;
}

.lrp_kit_cont ul{
	width: 100%;
}

.lrp_kit_cont ul li{
	padding: 0 30px;
	width: 50%;
	float: left;
	margin-bottom: 80px;
}

.lrp_kit_cont ul li .thumb{
	margin-bottom: 30px;
}

.lrp_kit_cont ul li .thumb .pro_img{
	width: 100%;
}

.lrp_kit_cont ul li .thumb .pro_img img{
	width: 100%;
}

@media(max-width:690px){
	.lrp_kit_cont ul li{
		width: 80%;
		float: none;
		margin : 30px auto;
		padding: 0;
	}
}

.lrp_kit_cont ul li .pro_ex p strong{
	display: block;
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 20px;
}

.lrp_kit_cont ul li .pro_ex span{
	display: block;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 20px;
}

.lrp_kit_cont ul li .pro_ex p{
	display: block;
	font-size: 24px;
	font-weight: 600;
}


.buy_btn{
	background: #BD8BCA;
	padding: 15px 25px 10px 30px;
	text-decoration: none !important;
	font-size: 20px;
	font-weight: 600;
	color: #fff !important;
	transition: all 0.5s;
	text-align: center;
}

.buy_btn:hover{
	background: #fff !important;
	color: #BD8BCA !important;
}