/* main {display: block; min-height: 800px;} */
main .inner > article:after {content: ""; display: block; clear: both;}

/* 메인 비주얼 영역 */

.multi_content{ position:relative; padding-top: 83px; }
.multi_content .inner1800{ height:692px; overflow:hidden;}

.multi_content .videoBox video {position: absolute; left:50%; top:50%;min-width: 100%; min-height: 100%; width: auto;height: auto; z-index: -100;background-size: cover;
	-webkit-transform:translate(-50%, -50%);
	-moz-transform:translate(-50%, -50%);
	-ms-transform:translate(-50%, -50%);
	-o-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
}


/***************************** MAIN text **********************************/
.main_text{ margin-top:10px;}
.main_text .wrap{ font-size:0; border-top:5px solid #de1a22}
.main_text .wrap:after{ display:block; content:''; clear:both;}
.main_text .wrap .con{ position:relative; width:50%; float:left;}
.main_text .wrap .con > *{ display:inline-block; vertical-align:top; width:50%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;  padding:20px 0; max-height:300px;}
.main_text .wrap .con:before{ content:url("/img/main/bg_viusal_text.png"); display:block; position:absolute; top:15px; left:24px; z-index:1;}
.main_text .wrap .con1{ background-color:#363636;}
.main_text .wrap .con1 .txtBox{ position:relative; z-index:2; padding-left:58px;}
.main_text .wrap .con1 .txtBox p{ font-size:50px; letter-spacing:-0.05em; font-weight:500; color:#fff; margin-bottom:28px; line-height: 50px; }
.main_text .wrap .con1 .txtBox dl{}
.main_text .wrap .con1 .txtBox dl dt{ font-family: "Noto Sans KR"; font-size: 22px; font-weight: 700; color: #fff; margin-bottom:14px;}
.main_text .wrap .con1 .txtBox dl dt span{ color: #de1a22;}
.main_text .wrap .con1 .txtBox dl dd{ opacity: .7; font-weight: 300; color: #fff; font-size:15px;}

.main_text .wrap .con1 .listBox{}
.main_text .wrap .con1 .listBox .list{ position:relative;}
.main_text .wrap .con1 .listBox .list > *{ display:inline-block; vertical-align:middle;}
.main_text .wrap .con1 .listBox .list .num{ position:relative; width:100px; height:100px; border:1px solid rgba(255,255,255,0.3); border-radius:50%; margin-right:40px; box-sizing:border-box;}
.main_text .wrap .con1 .listBox .list .num span{ position:absolute; top:50%; left:50%; font-family: "Roboto Condensed"; font-size: 30px; font-weight: 700;  color:#fff;
	-webkit-transform:translate(-50%, -50%);
	-moz-transform:translate(-50%, -50%);
	-ms-transform:translate(-50%, -50%);
	-o-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
}
.main_text .wrap .con1 .listBox .list .title{ width:calc(100% - 169px); font-size:18px; font-weight:500; font-family: "Noto Sans KR"; padding-bottom:11px; border-bottom:1px solid rgba(255,255,255,0.3); color:#fff;}
.main_text .wrap .con1 .listBox .list:nth-of-type(n+2){ margin-top:-20px;}

.main_text .wrap .con2{ background-color:#231f20;}
.main_text .wrap .con2 .txtBox{ padding-left:55px;}
.main_text .wrap .con2 .txtBox p,
.main_text .wrap .con2 .txtBox h3{  color:#fff;  z-index:2; position:relative;}
.main_text .wrap .con2 .txtBox p{ font-size:50px; letter-spacing:-0.05em; font-weight:500; margin-bottom:17px; line-height:50px;}
.main_text .wrap .con2 .txtBox p span{ color:#de1a22;}
.main_text .wrap .con2 .txtBox h3{ opacity: .7; font-weight: 300; font-size:15px;}
.main_text .wrap .con2 .txtBox .more{ margin-top:20px; margin-bottom:58px;}
.main_text .wrap .con2 .txtBox .more a{ position:relative; display:block; font-size: 12px; font-weight: 600; color: #fff; z-index:2;}
.main_text .wrap .con2 .txtBox .more a span{ display:inline-block; vertical-align:middle;}
.main_text .wrap .con2 .imgBox{ position:relative; padding:35px 0 0 44px;}
.main_text .wrap .con2 .imgBox img{}



/***************************** MAIN ad medium **********************************/
.main_ad_medium {margin: 70px auto;}
.main_ad_medium .info {float: left; width: 22%; box-sizing: border-box;}
.main_ad_medium .info .first {margin-bottom: 20px; font-size: 16px; font-weight: 500; color: #de1a22;}
.main_ad_medium .info h2 {margin-bottom: 20px; line-height: 50px; font-size: 50px; font-weight: 600; color: #222;}
.main_ad_medium .info .text {padding:0 80px 70px 0; font-size: 18px;}
.medium_visual_remote button {cursor: pointer;}


.medium_visual {float: left; width: 78%;}
.medium_visual .content {position: relative; padding-top: 20px;}
.medium_visual .content .title {float: left; padding-bottom: 5px; font-family: "Noto Sans KR"; font-size: 28px; font-weight: 700; color: #222;}
.medium_visual .content .title::after {content: ""; display: block; clear: both;}
.medium_visual .content .more {float: right; margin: 10px 10px 0 0; text-transform: uppercase; font-size: 12px; font-weight: 500; color: #222;}
.medium_visual .content .more::after {content: url("/img/main/icon_load_more.png"); display: inline-block; width: 14px; height: 10px; margin-left: 30px; vertical-align: 4px;}
.medium_visual .content dl {clear: both; line-height: 22px; opacity: 0; transition: all .5s;}
.medium_visual .content dl dt {font-size: 22px; font-weight: 500; color: #222;}
.medium_visual .content dl dd {font-family: "Noto Sans KR"; font-size: 16px; color: #555;}


.medium_visual .slider .slide {margin-right: 15px;}
.medium_visual .slider .slide .img {position: relative; width: 100%; height: 0; padding-bottom: 69%;}
.medium_visual .slider .slide .img img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; min-height: 100%; margin: auto;}
.medium_visual .slider .slide .img img.small_img {width: auto; min-height: auto; max-width: 70%; max-height: 70%; transition: all .5s;}
.medium_visual .slider .slide:hover .img img.small_img {opacity: 0;}
.medium_visual .slider .slide:hover .content dl {opacity: 1;}


/***************************** MAIN client **********************************/

.main_client {padding: 25px 0;}
.client_visual {position: relative; padding-right: 5%;}
.client_visual_remote {position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.client_visual_remote button {width: 15px; height: 30px;}
.client_visual_remote .center {font-family: "Noto Sans KR"; font-size: 18px; font-weight: 900; color: #666; vertical-align: -2px;}
.client_visual .slide img {max-width: 90%; max-height: 70px; margin: auto; vertical-align: middle; margin: 0 auto;}
/***************************** MAIN portfolio **********************************/
.main_portfolio {margin-bottom: 65px;}
.main_portfolio section {padding: 65px 0;}
.main_portfolio section:nth-child(odd) {background: #f5f5f5;}
.main_portfolio section .inner {position: relative;}
.main_portfolio section .title {position: relative; margin-bottom: 35px;}
.main_portfolio section .title h2 {font-size: 30px; font-weight: 600;}
.main_portfolio section .title h2 span {font-size: 24px; font-weight: 700; color: #de1a22;}
.main_portfolio section .title h2 span::before {content: ""; display: inline-block; height: 20px; margin: 0 25px 0 35px; border-left: 1px solid #727272; border-right: 1px solid #b5b5b5;}
.main_portfolio section .title a {position: absolute; top: 2px; right: 0; width: 145px; padding: 5px; background: #222; text-transform: uppercase; text-align: center; font-size: 12px; font-weight: 500; color: #fff;}
.main_portfolio section .title a::after {content: url("/img/main/icon_load_more.png"); display: inline-block; width: 14px; height: 10px; margin-left: 30px; vertical-align: 0;}
.main_portfolio section .list ul li {float: left; width: 24.25%; margin-right: 1%; margin-bottom: 18px; }
.main_portfolio section .list ul li:nth-child(4n) {margin-right: 0;}
.main_portfolio section .list ul li .img {position: relative; width: 100%; height: 0; padding-bottom: 57%; overflow: hidden;}
.main_portfolio section .list ul li .img img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; max-width: 100%; margin: auto;}
.main_portfolio section .load_more {position: absolute; top: 2px; right: 0; width: 145px; padding: 5px; background: #222; text-transform: uppercase; text-align: center; font-size: 12px; font-weight: 500; color: #fff;}
.main_portfolio section .load_more::after {content: url("/img/main/icon_load_more.png"); display: inline-block; width: 14px; height: 10px; margin-left: 30px; vertical-align: 0;}

/***************************** MAIN 매체사, 협력사, 광고주 **********************************/
.main_list_group section {display: table; width: 100%; margin-bottom: 60px;}
.main_list_group section > div {display: table-cell;}
.main_list_group section .title {position: relative; width: 200px; margin-right: 40px; background: #e1e1e1; vertical-align: top;}
.main_list_group section .title.line {height: 200px;}
.main_list_group section .title h2 {position: relative; height: 100px; padding-left: 30px; line-height: 100px; font-size: 24px; font-weight: 700; box-sizing: border-box;}
.main_list_group section .title.line h2::before {content: ""; position: absolute; bottom: 0; right: 0; width: calc(100% - 30px); height: 1px; background: #fff;}
.main_list_group section .title p {position: absolute; bottom: 30px; left: 30px; text-transform: uppercase; font-size: 18px; font-weight: 600; color: #fff;}
.main_list_group section .list {width: calc(100% - 240px); padding-left: 40px; box-sizing: border-box;}
.main_list_group section .list ul { border-top: 1px solid #ccc;}
/**/
.main_list_group section:nth-child(2) .list ul {border-top: none;}
.main_list_group section:nth-child(2) .list ul li:nth-child(-n+6) {border-top: 1px solid #ccc;}
/**/
.main_list_group section .list ul li {float: left; width: 16.66666%;}
.main_list_group section .list ul li .img {position: relative; width: 100%; height: 0; padding-bottom: 38%; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; box-sizing: border-box;}
.main_list_group section .list ul li:nth-child(6n) .img {border-right: 1px solid #ccc;}
.main_list_group section .list ul li:last-child .img {width: 100%; border-right: 1px solid #ccc!important;}
.main_list_group section .list ul li img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; max-width: 90%; max-height: 100%; margin: auto;}

