/*2024-07-08************************************************/


/*_pc*/
@media all and (min-width:1200px) {	 
    
    .h2G{display:flex;justify-content: space-between;align-items:center}
    .h2G h2{font-size:16px;margin:30px 0; font-weight:400}  
    
    .h2G .more a{display:inline-block;line-height:20px;border:0 solid #CCC;padding:0 3px;border-radius:3px;font-size:12px; color:#666}
    
    table{width:100%;border-collapse:collapse;margin:20px 0;font-size:15px}
    
    /*item 배너 공통*/
    .itemG .item{position:relative;background:#fff}
    .itemG .item a{display:block;}
    .itemG .item .thumb img{width:auto;height:120px;object-fit: cover}
    .itemG .item .inner{padding:20px}
    .itemG .item .inner > span{display:block;font-size:15px;}
    
    .itemG .item .inner .name{font-size:14px;color:#000; margin:0 0 5px 0}
    .itemG .item .inner .title{margin:5px 0; height:48px; font-weight:600;line-height:1.5;	}
	.itemG .item .inner .text-overflow{
	   width: 100%;
	   overflow: hidden;
	   word-break: break-word;	   	
	   display: -webkit-box;
	   -webkit-line-clamp: 2;
	   -webkit-box-orient: vertical}
    .itemG .item .inner .location{display:inline-block; color:#777; font-size:12px}
    .itemG .item .inner .theme{display:inline-block;position:relative;padding-left:10px; color:#777; font-size:12px}
    .itemG .item .inner .theme:before{display:inline-block;content:'';position:absolute;left:3px;top:50%;transform:translateY(-50%);width:1px;height:10px;background:#aaa}


    .msec1{background:#f5f5f5;padding:30px 0}
    .msec1 .itemG .item{height:240px !important;margin-top:0 !important}
    .msec1 .container{display:flex;gap:16px;flex-wrap:wrap}
    .msec1 .cont1{width:calc(100% - 240px * 2 - 16px - 16px * 1);border-radius:10px;overflow:hidden}
    .msec1 .cont1 img{vertical-align:top}
    .msec1 .cont2{width:calc(240px * 2 + 16px)}
    .msec1 .cont3{width:calc(100% - 240px * 4 - 16px - 16px * 3); border-radius:10px;background:#fff;height:240px;overflow:hidden}
    .msec1 .cont4{width:calc(240px * 4 + 16px * 3)}
	

	.msec1 .cont2 .thumb img,
	.msec1 .cont4 .thumb img{display:block;height:60px;margin:20px auto 0}

    .msec1 .swiper-container{border-radius:10px;overflow:hidden;padding-bottom:2px}
    .msec1 .swiper-slide{border:1px solid #ddd;border-radius:10px;background:#fff;overflow:hidden}
    
    .msec1 .cont3{display:flex;;border:1px solid #eee}
	.msec1 .cont3 > div:first-child {border-left:none}
	.msec1 .cont3 > div{flex:1;border-left:1px solid #ddd}
    .msec1 .cont3 .tit{line-height:45px;text-align:center;font-size:15px;border-bottom:1px solid #ddd}

    .msec1 .cont3 ul{height:calc(100% - 45px);overflow:auto}
    .msec1 .cont3 ul li{line-height:35px;padding:0 10px;cursor:pointer;font-size:14px}
    .msec1 .cont3 ul li.on,
	.msec1 .cont3 ul li:active,
    .msec1 .cont3 ul li:hover{background:var(--main-color-light);color:var(--main-color)}	
	.msec1 .cont3 ul li a {display:block}
    
     .msec1 .cont4 .inner .title{margin-bottom:30px}

    /*홈 플래티넘*/
    .msec2{margin:50px 0 80px}
    .msec2 .itemG{display:flex;gap:16px;flex-wrap:wrap}
    .msec2 .item{width:calc((100% - 16px*3)/4);border:1px solid #ddd;border-radius:10px;overflow:hidden}
    .msec2 .item .thumb img{display:block;height:60px;margin:20px auto 0}
    
    
    /*홈 프리미엄*/
    .msec3{background:#f5f5f5;padding:30px 0 60px}
    .msec3 .itemG{display:flex;gap:16px;flex-wrap:wrap}
    .msec3 .item{width:calc((100% - 16px*4)/5);border:1px solid #ddd;border-radius:10px;overflow:hidden}
    .msec3 .item .thumb img{display:block;height:40px;margin:20px auto 0}
	
	.itemG .item.hatLine{border-top:2px solid #6176ce !important;}

	.msec3_banner{max-width:1400px;margin:60px auto}
    
    /*홈 라이트*/    
    .msec4{margin:50px 0}
    .msec4 table thead{border-top:1px solid #000}
    .msec4 table tbody tr:hover{background:var(--main-color-light)}
    .msec4 table th,
    .msec4 table td{padding:20px 20px;text-align:center;border-bottom:1px solid #ddd}
    .msec4 table th{border-bottom:1px solid #999}
    .msec4 table td.name{text-align:left;width:15%}
    .msec4 table td.tit{text-align:left}
    .msec4 table td.location{width:15%}
    .msec4 table td.theme{width:15%}


}

    

/*_mobile*/
@media all and (max-width:1199px) {

	.container{padding:0 3%}
    
   .h2G{display:flex;justify-content: space-between;align-items:baseline;margin:20px 0 10px;gap:5px;}
   .h2G h2{font-size:20px;}    
    .h2G .more a{display:inline-block;line-height:24px;color:#666;padding:0 3px;;font-size:12px}
    
    table{width:100%;border-collapse:collapse;margin:20px 0}
    
    /*item 배너 공통*/
    .itemG .item{position:relative;background:#fff;border:1px solid #ddd;border-radius:10px;overflow:hidden}
    .itemG .item a{display:block;}
	.itemG .item .thumb{text-align:center}
    .itemG .item .thumb img{width:auto;max-height:45px;margin:20px auto 0}
    .itemG .item .inner{padding:10px}
    .itemG .item .inner > span{display:block;font-size:13px;}
    
    .itemG .item .inner .name{font-size:12px;color:#777}
    .itemG .item .inner .title{font-size:14px;margin:6px 0;min-height:44px; font-weight:600;line-height:1.5;	}
	.itemG .item .inner .text-overflow{
	   width: 100%;
	   overflow: hidden;
	   word-break: break-word;	   	
	   display: -webkit-box;
	   -webkit-line-clamp: 2;
	   -webkit-box-orient: vertical}
    .itemG .item .inner .location{display:block;font-size:12px;color:#777; padding:0 0 0 0}
    .itemG .item .inner .theme{display:inline-block;position:relative;padding-left:9px;font-size:12px;color:#777}
    .itemG .item .inner .theme:before{display:inline-block;content:'';position:absolute;left:4px;top:50%;transform:translateY(-50%);width:1px;height:10px;background:#aaa}
	.itemG .item .inner .theme.nobar{padding-left:0}
	.itemG .item .inner .theme.nobar:before{display:none}

	#wrapper .msec1{padding:0}

    .msec1{background:#f5f5f5;padding:20px 0}
    .msec1 .container{display:flex;gap:10px;flex-wrap:wrap}
    .msec1 .cont1{width:100%;border-radius:10px;overflow:hidden}
    .msec1 .cont1 img{;vertical-align:top}
    .msec1 .cont2{width:100%}
    .msec1 .cont3{width:100%;border:1px solid #ddd;border-radius:10px;background:#fff;overflow:hidden}    
    
    .msec1 .cont3{display:flex;}
	.msec1 .cont3 > div:first-child{border-left:0}
	.msec1 .cont3 > div{flex:1;border-left:1px solid #ddd}
    .msec1 .cont3 .tit{display:flex;justify-content:center;gap:0;align-items:center;line-height:35px;text-align:center;font-size:14px;padding-left:10px}
	.msec1 .cont3 .tit i{display:inline-block;width:20px;height:20px;background:url('/img/ico_arrow_bottom.png') no-repeat center /10px}
	.msec1 .cont3.on ul{display:block}
    .msec1 .cont3 ul{display:none;height:110px;overflow:auto;border-top:1px solid #eee}
    .msec1 .cont3 ul li{line-height:35px;padding:0 20px;cursor:pointer;font-size:14px}
    .msec1 .cont3 ul li.on,
    .msec1 .cont3 ul li:hover{background:var(--main-color-light);color:var(--main-color)}	

	.msec1 .cont4{width:100%}
    .msec1 .swiper-container{border-radius:10px;overflow:hidden}
    .msec1 .swiper-slide{border:1px solid #ddd;border-radius:10px;background:#fff;overflow:hidden}
	.msec1 .cont4 .swiper-wrapper{height:370px}
	.msec1 .cont4 .swiper-slide{}
    
    

    /*홈 플래티넘*/
    .msec2{margin:30px 0}
	.msec2 .more{flex:1}
	.msec2 .swiper-pagination{position:relative;width:auto;top:0;color:#777}
	.msec2 .swiper-pagination .swiper-pagination-current{color:var(--main-color)}
	.msec2 .swiper-wrapper{height:760px}

    
    .msec3_mo{margin:30px 0}
    
    
    /*홈 프리미엄*/
    .msec3{background:#f5f5f5;padding:20px 0 30px}
	
	.msec3 .more{flex:1}
	.msec3 .swiper-pagination{position:relative;width:auto;top:0;color:#777}
	.msec3 .swiper-pagination .swiper-pagination-current{color:var(--main-color)}
	.msec3 .swiper-wrapper{height:850px}
	.msec3 .itemG .item .thumb img{max-height:25px}
	.msec3 .itemG .item .inner .tit{font-size:13px}
	.msec3 .itemG .item .inner .location,
	.msec3 .itemG .item .inner .theme{}

	.itemG .item.hatLine{border-top:2px solid #6176ce}

	.msec3_banner{max-width:1400px;margin:20px auto}
    
    /*홈 라이트*/    
    .msec4{padding:30px 0 60px}
    .msec4 table thead{border-top:1px solid #000}
    .msec4 table tbody tr:hover{background:var(--main-color-light)}
    .msec4 table th,
    .msec4 table td{padding:20px 20px;text-align:center;border-bottom:1px solid #ddd}
    .msec4 table th{border-bottom:1px solid #999}
    .msec4 table td.name{text-align:left;width:15%}
    .msec4 table td.tit{text-align:left}
    .msec4 table td.location{width:15%}
    .msec4 table td.theme{width:15%}




}