/* 메인슬라이더 */
#idx_wrapper{ position:relative;}
#visual{width:100%; min-width:1100px; height:750px;position:relative; overflow:hidden;}
a{cursor:pointer}

#visual #slogan{width:1000px;position:absolute;top:250px;left:50%;margin-left:-500px;z-index:998;visibility:hidden;text-align:center;text-shadow: 0 0 5px #00000056;}
#visual #slogan .img01{visibility:hidden;font-size:2em;font-weight:300;color:#fff;letter-spacing:5px;/* font-family: 'MBC1961M'; */}
#visual #slogan .img02{ visibility:hidden; font-size:4em; font-weight:500; color:#fff; letter-spacing:-1px;font-family: 'MBC1961M';}
#visual #slogan .img03{ font-size:23px;font-weight:300; line-height:1.5em; color:#fff;visibility:hidden; margin-top:5px;font-family: 'MBC1961M';}
#visual #slogan .mt{ visibility:hidden; font-size:19px; color:#adadad; margin:10px 0 20px 0;}

#visual .bx-wrapper:after{display: block; content: ""; width: 100%; height: 50%; position: absolute; top: 0; left: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
    background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    z-index: 11;}
#visual .sliderbx{ z-index:10;visibility:hidden}
#visual .sliderbx li{ height:750px; background-position:center top; background-repeat:no-repeat;}
#visual .sliderbx li.mv01{ background-image:url(../img/main/mvisual01.jpg);}
#visual .sliderbx li.mv02{ background-image:url(../img/main/mvisual03.jpg);}
#visual .sliderbx li.mv03{ background-image:url(../img/main/mvisual04.jpg);}
#visual .sliderbx li.mv04{ background-image:url(../img/main/mvisual02.jpg);}
#visual .sliderbx li a{ display:block; width:100%; height:750px;}

#visual div.bx-pager{ width:140px; position:absolute; bottom:300px; left:50%; margin-left:-70px; z-index:101; text-align:center;}
#visual div.bx-pager div{ display:inline-block; margin:0 4px;}
#visual div.bx-pager div a{ display:block; width:12px; height:12px; background:#fff; text-indent:-9999px; border-radius:30px;}
#visual div.bx-pager div a.active{ background:#00b2ed; width:40px;}
#visual div.bx-controls-direction a{
    display:block; width:40px; height:40px; border-bottom:3px solid #FFF; border-left:3px solid #FFF; border-radius:0 0 0 5px; text-indent:-9999px; position:absolute; top:50%; margin-top:-25px !important; z-index:1000; display:none;} /*좌우버튼동시선택*/
#visual a.bx-prev{ transform:translateY(-50%) rotate(45deg); left:30px;}
#visual a.bx-next{ transform:translateY(-50%) rotate(-135deg); right:30px;}
#visual div.bx-controls-auto{position:absolute; width:40px; top:30px; z-index:2; left:50%; margin-left:470px; }
#visual div.bx-controls-auto a{	float:left; margin-right:3px; width:12px; height:12px; border-radius:9px; color:#FFF; text-align:center; line-height:12px; font-size:12px; text-indent:-9999px;	} /*플레이스탑버튼동시선택*/
#visual div.bx-controls-auto a.bx-start{background:url(../img/common/btn_play.png) no-repeat 50% 50% #4C5365;}
#visual div.bx-controls-auto a.bx-stop{background:url(../img/common/btn_stop.png) no-repeat 50% 50% #4C5365;}


/*메인-중간컨텐츠1*/
#middle{ width:100%; min-width:1200px; height:600px;}
#middle:after{ display:block; content:""; clear:both;}
#middle_in{ width:1400px; margin:0 auto; box-sizing: border-box; position:absolute; top:650px; left:50%; transform: translateX(-50%); z-index:10;
    display: grid; grid-template-columns: repeat(4, 1fr);}
#middle_in > div:nth-child(5),
#middle_in > div:nth-child(6){grid-column: span 2;height: 250px;}
#middle_in:after{ display:block; content:""; clear:both;}
#middle_in .mid{width:100%; height:300px; overflow:hidden; background-size: cover; background-position: left bottom; box-sizing: border-box; padding:35px 35px; position:relative; visibility:hidden;}
#middle_in .mid:before{content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; background-size: cover; background-position: left bottom; opacity: 0.5;}
#middle_in .mid a{z-index: 2; height: 100%; position: relative; display: block;}
#middle_in .mid01{ background-color:#1699dc;}
#middle_in .mid01:before{background-image:url(../img/main/mid01_bg.png);}
#middle_in .mid02{background-color:#0d6592;}
#middle_in .mid02:before{background-image:url(../img/main/mid02_bg.png);}
#middle_in .mid03{ background-color:#d3ebf8;}
#middle_in .mid03:before{ background-image:url(../img/main/mid03_bg.png);}
#middle_in .mid04{ background-color:#f2f2f2;}
#middle_in .mid05{ background-image:url(../img/main/mid05_bg.png); background-color:#1166c6;}
#middle_in .mid06{ background-image:url(../img/main/mid06_bg.png); background-color:#ffffff;}
#middle_in .mid07{ /*background-image:url(../img/main/mid07_bg.png);*/ background-color:#134986;}

#middle .mb_title{font-size: 2em;color:#fff;font-family: 'MBC1961M';}
#middle .mb_title span{display:block;font-size: 13px;font-family: 'SUIT';color:rgba(250,250,250,0.4);}
#middle p{ font-size:14px; line-height:1.6em; font-weight:400; color:#eee; margin:15px 0 20px 0;word-break: keep-all; word-wrap:break-word;}
#middle .mb_link{ position:absolute; bottom:0px; right:0px; display:block; width:45px; height:45px; text-align:center; line-height:45px; font-size:2em; color:#fff; transition:all 0.3s;}
#middle .mb_link:hover{ background:#fff; color:#666; transition:all 0.3s;}

#middle_in .mid03 .mb_title, #middle_in .mid04 .mb_title, #middle_in .mid06 .mb_title{ color:#222;}
#middle_in .mid03 span, #middle_in .mid04 span, #middle_in .mid06 span{ color:rgba(0,0,0,0.3);}
#middle_in .mid03 p, #middle_in .mid04 p, #middle_in .mid06 p{ color:#777;}
#middle_in .mid03 .mb_link, #middle_in .mid04 .mb_link, #middle_in .mid06 .mb_link{ color:#333;}
#middle_in .mid03 .mb_link:hover, #middle_in .mid04 .mb_link:hover, #middle_in .mid06 .mb_link:hover{ background:#ddd;}

/*메인-중간컨텐츠2*/
#mv_ban{ width:1200px; margin:0 auto 50px auto; display: none;}
#mv_ban:after{ display:block; content:""; clear:both;}
#mv_ban .mv_box{ float:left; width:340px; height:250px; visibility:hidden;}
#mv_ban .mv_box:after{ display:block; content:""; clear:both;}
#mv_ban .mv_box1{ }
#mv_ban .mv_box2{ width:400px; margin:0 50px;}
#mv_ban .mv_box3{ background:url(../img/main/mv_box3_bg.jpg) no-repeat center bottom;}
#mv_ban .mv_box3 h2{ font-family: 'MBC1961M';font-size:2.3em; margin:5px 0 20px 0;}
#mv_ban .mv_box3 h2 strong{ color:#09468c;}
#mv_ban .mv_box3 p{ font-size:14px; color:#888;}
#mv_ban .mv_box3 span:first-child{ color:#379b0c;}
#mv_ban .mv_box3 span:last-child{ color:#125bb4;}
#mv_ban .mv_box3 ul:after{ display:block; content:""; clear:both;}
#mv_ban .mv_box3 li{ float:left; width:44%; font-size:1.2em; margin:4px 20px 4px 0; position:relative;}
#mv_ban .mv_box3 li a{ color:#777;}
#mv_ban .mv_box3 li i{ position:absolute; top:2px; right:0px; width:20px; height:20px; border:1px solid #ccc; font-size:12px; color:#ccc; border-radius:50%; line-height:20px; text-align:center;}
#mv_ban .mv_box3 li a:hover{ color:#222;}
#mv_ban .mv_box3 li a:hover i{ border-color:#999; color:#888;}


/* 메인추출탭 */
.tbbs{position:relative; width:100%; padding-top:30px;}
.tbbs .tab h3{width:106px; height:32px; line-height:28px; text-align:center; background:#DEE3EC; color:#3D4353; border-radius:30px; position:absolute; top:0; font-size:1.1em; cursor:pointer;}
.tbbs .tab .t1{left:0;}
.tbbs .tab .t2{left:110px;}
.tbbs .tab .t3{left:220px;}
.tbbs .tab .pannel{ padding: 25px 3px 15px 3px; min-height:180px; display:none;}
.tbbs .tab.on .pannel{display:block;}
.tbbs .tab.on h3{background:#1699DC; color:#FFF;}
/* 갤러리추출 */
.mgall{width:425px; position:relative;}
.mgall h2{ font-family: 'MBC1961M'; font-size:1.6em; margin-bottom:20px; color:#222;}
.mgall .more{ position:absolute; right:0; top:5px; font-size:0.9em; color:#999; padding-right:25px; background:url(../img/common/more.jpg) right 50% no-repeat;}

/*메인-중간배너*/
#mbanner{ /*margin-bottom:80px;*/ height:300px; background:url(../img/main/mbanner_bg.jpg) center 50% no-repeat; text-align:center; visibility:hidden;}
#mbanner .mb_text{/* font-family: 'MBC1961M'; */font-size:2.2em;color:#fff;padding-top:70px;}
#mbanner .mb_text p{/* font-family: 'MBC1961M'; */font-size:16px;margin-top:10px;}
#mbanner .mb_text a{display:inline-block;font-size: 15px;color:#fff;margin-top:40px;border:2px solid #fff;padding:0 50px;line-height:45px;transition:all 0.3s;}
#mbanner .mb_text a:hover{ color:#222; background:#fff; transition:all 0.3s;}


@media (max-width:1000px) {
    #visual{ min-width:100%; height:350px;}

    #visual #slogan{ width:320px; top:120px; margin-left:-160px;}
    #visual #slogan .img01{font-size: 1em;}
    #visual #slogan .img02{ font-size:2em;}
    #visual #slogan .img03{font-size: 14px;}

    #visual .sliderbx{}
    #visual .sliderbx li{ height:350px; background-size:cover;}
    #visual .sliderbx li a{ height:350px;}

    #visual div.bx-pager{bottom: 20px;}
    #visual div.bx-pager div { margin:0 2px;}
    #visual div.bx-pager div a{ width:10px; height:10px;}
    #visual div.bx-controls-direction{ display:none;}


    /*메인-중간컨텐츠1*/
    #middle{ min-width:100%; height:auto;}
    #middle_in{ width:100%; position:relative; top:auto; left:auto; margin-left:0px; grid-template-columns: repeat(2, 1fr); transform: translateX(0);}
    #middle_in .mid{width:100%;height: 175px;padding:20px 20px;background-size:cover;}
    #middle_in > div:nth-child(5), #middle_in > div:nth-child(6){height: 175px}

    #middle .mb_title{ font-size:1.8em;}
    #middle .mb_title span{font-size:0.9em;display: none;}
    #middle p{/* display:none; */overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;width:100%;}
    #middle .mb_link{ width:35px; height:35px;line-height:35px; font-size:1.5em;}



    /*메인-중간컨텐츠2*/
    #mv_ban{ width:90%; margin:0 auto;}
    #mv_ban .mv_box{ float:none; width:100%; height:auto; min-height:100px;}
    #mv_ban .mv_box1{ height:147px; overflow:hidden;}
    #mv_ban .mv_box2{ width:100%; margin:20px 0 30px 0px; border-top:1px dotted #ddd; border-bottom:1px dotted #ddd; padding:30px 0;}
    #mv_ban .mv_box3{ background-size:100%; padding-bottom:100px;}
    #mv_ban .mv_box3 h2{ font-size:1.8em;}
    #mv_ban .mv_box3 p{ font-size:13px;}
    #mv_ban .mv_box3 li{ width:calc(50% - 20px); font-size:1em; margin:3px 10px;}
    #mv_ban .mv_box3 li i{ position:absolute; top:2px; right:0px; width:20px; height:20px; border:1px solid #ccc; font-size:12px; color:#ccc; border-radius:50%; line-height:20px; text-align:center;}
    #mv_ban .mv_box3 li a:hover{ color:#222;}
    #mv_ban .mv_box3 li a:hover i{ border-color:#999; color:#888;}


    /* 메인추출탭 */
    .tbbs .tab h3{width:90px; font-size:1em;}
    .tbbs .tab .t2{left:95px;}
    .tbbs .tab .t3{left:190px;}
    /* 갤러리추출 */
    .mgall{width:100%;}
    .mgall h2{ font-size:1.4em;}
    .mgall .more{ position:absolute; right:0; top:5px; font-size:0.9em; color:#999; padding-right:25px; background:url(../img/common/more.jpg) right 50% no-repeat;}

    /*메인-중간배너*/
    #mbanner{ /*margin-bottom:40px;*/ height:180px; background-size:cover;}
    #mbanner .mb_text{ font-size:1.5em; padding:32px 20px;}
    #mbanner .mb_text p{ font-size:13px; margin-top:5px;}
    #mbanner .mb_text a{ font-size:13px; margin-top:20px; padding:0 30px; line-height:35px;}

}