@charset "utf-8";
/*@latest 2020.11.26 yhy */

.quick129 {width: 100%; box-sizing:border-box;}

.quick129 ul.quick_wrap {position:relative;width: 100%;height: 100%;float: left;/* border: 1px solid rgba(0,0,0,0.1); */box-sizing: border-box;}
.quick129 ul.quick_wrap > li {width:25%; float:left; display:inline-block; text-align: center;}
.quick129 ul.quick_wrap > li h3 {display: inline-block;width: 100%;}
.quick129 ul.quick_wrap > li h3 a.tit {position: relative; float:left; width:100%; height: 60px; line-height: 60px; padding:0 15px; font-size:24px; box-sizing: border-box; color:#fff;}

.quick129 ul.quick_wrap > li h3.name1 a.tit{background:#0085d1;}
.quick129 ul.quick_wrap > li h3.name2 a.tit{background:#009688;}
.quick129 ul.quick_wrap > li h3.name3 a.tit{background:#265da8;}
.quick129 ul.quick_wrap > li h3.name4 a.tit{background:#607d8b;}

.quick129 ul.quick_wrap > li h3 a:after{content:''; display: block; position: absolute; bottom:-42px; left:50%; transform: translate(-50%, -50%) rotate( -90deg );border-top: 15px solid transparent; border-bottom: 15px solid transparent; z-index:1;}
.quick129 ul.quick_wrap > li.active h3.name1 a:after{border-right: 25px solid #0085d1;}
.quick129 ul.quick_wrap > li.active h3.name2 a:after{border-right: 25px solid #009688;}
.quick129 ul.quick_wrap > li.active h3.name3 a:after{border-right: 25px solid #265da8;}
.quick129 ul.quick_wrap > li.active h3.name4 a:after{border-right: 25px solid #607d8b;}

.quick129 ul.quick_wrap li div .cnt_link {display:none; position:absolute; height:auto;}
.quick129 ul.quick_wrap > li.active div .cnt_link {display:table; position:absolute; top:60px; right:0; width:100%; height: 290px; box-sizing: border-box; border-bottom: 1px solid #eee; border-right: 1px solid #eee; border-left: 1px solid #eee; }
.quick129 ul.quick_wrap ul li a {text-decoration:none; position:relative; width:100%; float:left;}

.quick129 ul.quick_wrap .imgbox{display: table-cell; vertical-align: middle; width: 25%; height: 100%; background: #ecf5fa;}
.quick129 ul.quick_wrap .imgbox img{max-width: 119px; width: auto; max-height: 119px; height: auto;}
.quick129 ul.quick_wrap .cnt_link{display: table; height: 250px; width: 100%;float: right; width: 75%; background: url('/sample/layout/contents/quick/quick129/img/bg_pattern.png');}
.quick129 ul.quick_wrap .cnt_link li{float:left; width: 33.33%; text-align: center; font-size: 17px; line-height: 36px;}
.quick129 ul.quick_wrap .cnt_link ul{display: table-cell; vertical-align: middle;}
.quick129 ul.quick_wrap .cnt_link ul li a {color: #0068b7;}
.quick129 ul.quick_wrap .cnt_link ul li a:before{content:'\f08e'; margin-right: 5px; font-family: FontAwesome; font-size: 16px; vertical-align: middle; font-weight: 600;}
.quick129 ul.quick_wrap .cnt_link ul li a span{color:#000;}

/* layout setting */
.layout_01 .quick129 {height:350px;}
.layout_02.layout_height_M .quick129 ul.quick_wrap > li.active div .cnt_link, .layout_02.layout_height_M .quick129 ul.quick_wrap > li.active div .cnt_link {height: 190px;}
.layout_02_36.layout_06.layout_height_M .quick129 ul.quick_wrap > li.active div .cnt_link, .layout_03.layout_height_M .quick129 ul.quick_wrap > li.active div .cnt_link{height: 190px;}

/* 4단 이미지제공 안함 */
.layout_block4 .quick129 ul.quick_wrap .imgbox, .layout_04.layout_04mr.layout_height_M .quick129 ul.quick_wrap .imgbox, .layout_04.layout_04ml.layout_height_H .quick129 ul.quick_wrap .imgbox{display: none;}
.layout_04.layout_height_M .quick129 ul.quick_wrap > li.active div .cnt_link{height: 190px;}

/* 3단 */
.layout_03.layout_height_H .quick129 ul.quick_wrap .imgbox img, .layout_03.layout_height_M .quick129 ul.quick_wrap .imgbox img{width: 80%;}

	@media (min-width:800px){
		.quick129 ul.quick_wrap > li>div {height:60px;}
		.quick129 ul.quick_wrap > li.active div ul {top: 60px;}

		.layout_height_H .quick129 {height:350px;}
		.layout_height_M .quick129 {height:250px;}
	}

	@media (min-width:800px) and (max-width:1200px){}

	@media (max-width:799px){
		.quick129 ul.quick_wrap > li>div {height:44px;}
		.quick129 ul.quick_wrap > li.active div ul {top: 43px;}
		.quick129 ul.quick_wrap > li h3 a.tit {font-size:17px;}

		.layout_01 .quick129 {height:325px;}
		.layout_height_H .quick129 {height:335px;}
		.layout_height_M .quick129 {height:240px;}
		.layout_height_L .quick129 {height: 150px;}

		.quick129 ul.quick_wrap .cnt_link li{font-size:16px;}
		.quick129 ul.quick_wrap .cnt_link ul li a:before{font-size: 15px;}
		.quick129 ul.quick_wrap .imgbox img{width: 80%!important;}
	}

	@media (min-width:600px) and (max-width:799px){
		.layout_block4 .layout_04.layout_height_H .quick129 {height:350px;}
		.layout_block4 .layout_04.layout_height_M .quick129 {height:250px;}
	}
	@media (max-width:599px){}
