@charset "utf-8";


@-webkit-keyframes ProgressDots {from {width: 0px;}to {width: 100%;}}
@keyframes ProgressDots {from {width: 0px;}to {width: 100%;}}

@-webkit-keyframes scrolldown{0%{transform:translateY(-100%)}100%,80%{top:120%;transform:translateY(0)}}
@keyframes scrolldown{0%{transform:translateY(-100%)}100%,80%{top:120%;transform:translateY(0)}}

a[target="_blank"] {padding:0; background:none;}

.headerWrap {position:absolute; z-index:2;position:absolute; left:0; top:0; width:100%; }
#header {border:none;}
#gnb {box-shadow:none;}
#footerwrap {margin:0;}

#mcontainer {position:relative; z-index:1; }
#main-menu {position:fixed; right:30px; top:50%; z-index:99; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
#main-menu:after {display:block; content:''; position:absolute; left:0; top:0;width:1px; height:0; background:#47a29c;  transition:all 0.3s; -webkit-transition:all 0.3s; }
.fp-viewing-MAIN2 #main-menu:after {height:80px;}
.fp-viewing-MAIN3 #main-menu:after {height:160px;}
.fp-viewing-MAIN4 #main-menu:after {height:240px;}
.fp-viewing-MAIN5 #main-menu {display:none;}
#main-menu li {position:relative;height: 80px;border-right:1px solid #ddd;}
#main-menu li a {display:block; position:relative;}
#main-menu li span {display:block;opacity:0;position:absolute;top: 0;right: -9px;z-index:2;content:'';width: 17px;height: 17px;border-radius:50%;background: rgba(62,158,152,.4);transition:all 0.3s;-webkit-transition:all 0.3s;}
#main-menu li span:before {display:block; opacity:0; position:absolute; left:3px; top:3px; content:''; width:11px; height:11px; border-radius:50%; background:#3e9e98; }
#main-menu li em {display:block;position:absolute;top: 32px;right: -12px;width: 80px;height: 30px;font-size:14px;color:#6b6a6a;letter-spacing: 0.08em;transform: rotate(90deg);}
#main-menu li.active span,
#main-menu li.active span:before {opacity:1; }
#main-menu li.active em {color:#3e9e98; font-weight:bold; }

.section {}
.section .cont {margin:50px 0 0;}
.section .leftit {float:left;width:440px;}
.section .leftit .inner {position:absolute;width: 440px;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.section .leftit strong {display:block; line-height:1; font-family:'score'; font-size:48px; font-weight:bold; color:#000;}
.section .leftit p {margin:35px 0 0; font-size:17px; color:#555;}
.section .leftit p span {display:block;font-size:17px; color:#555; }
.section .leftit .btnbox {margin:55px 0 0; }
.section .leftit .btnbox a {display:block; font-size:18px; color:#323232;}
.section .leftit .btnbox a span {display:inline-block;position: relative;width:20px;height:20px;margin-top: -2px;margin-left: 15px;border-radius:50%;background:#272727;vertical-align:middle;}
.section .leftit .btnbox a span:before {display:block;position:absolute;right: 8px;top: 6.5px;content:'';width:5px;height:5px;border-radius: 2px;border:solid #fff;border-width:2px 2px 0 0;transform:rotate(45deg);-webkit-transform:rotate(45deg);}
.section .rightcont {float:right; width:calc(100% - 440px);}

#section1 {}
#section1 .group1 {position:relative;height:630px;margin: 50px 0;}
#section1 .group1:before {display:block;position:absolute;content:'';left:0;right: 51%;top: -100%;bottom: 70px;background: #f7f9f9;}
#section1 .group1 .box1 {float:left;position: relative;width:580px;padding: 118px 0 0;}
#section1 .group1 .box1 > span {display:block;line-height:1;font-size:14px;font-family:'score';font-weight: 200;text-transform:uppercase;color:#6b6a6a;letter-spacing:0.5em;text-indent: 6px;}
#section1 .group1 .box1 strong {display:block;margin:20px 0;line-height:1.1;font-family:'score';font-size:48px;color:#000;letter-spacing: -0.05em;}
#section1 .group1 .box1 strong span {display:block;font-weight: 200;}
#section1 .group1 .box1 strong em {display:inline-block; color:#328f89; }
#section1 .group1 .box1 p {font-size:17px;color:#555;text-indent: 2px;}
#section1 .group1 .box1 .searchFrm {position: relative;width:435px; margin:60px 0 0;}
#section1 .group1 .box1 .searchFrm input[type="search"]{width:100%;height:60px;padding: 0 35px;border:1px solid #3e9e98;border-radius: 50px;font-size:15px;color:#000;box-shadow: 4px 5px 7px rgba(0,0,0,.2);}
#section1 .group1 .box1 .searchFrm input[type="search"]::placeholder {color:#b6b6b6; font-size:15px;}
#section1 .group1 .box1 .searchFrm .submit {}
#section1 .group1 .box1 .searchFrm .submit input {position:absolute;right:10px;top:10px;width:112px;height:40px;line-height:40px;padding: 0 0 0 20px;border: 1px solid #3e9e98;border-radius:50px;background: #3e9e98 url(/images/media/main_new/search.png)no-repeat 10px center;color:#fff;font-size: 15px;}
#section1 .group1 .box2 {float: right;width:calc(100% - 580px);}

#main_visual {overflow:hidden;position: relative;width:100%;border-radius:0 0 100px 0;box-shadow:5px 5px 15px rgba(0,0,0,.3);}
#main_visual .viewer_area {position:relative;}
#main_visual .viewer_area .imgbox {width:100%;height:630px;background-size:cover;background-position:center;vertical-align: top;}
#main_visual .viewer_area .imgbox .tip {display: inline-block;position: absolute;right: 80px;bottom: 40px;padding: 9px 20px 9px 40px;border-radius: 30px;background: rgba(0,0,0,.5) url(/images/media/main_new/map.png)no-repeat 15px center;color:#fff;}
#main_visual .slick-autoplay-toggle-button {display:none;}
#main_visual .control {position:absolute;left:0;bottom: 0;z-index: 1;background: #3e9e98;}
#main_visual .control strong {display:block;line-height: 1.3;font-size:50px;font-weight:bold;color:#fff;letter-spacing: -0.07em;}
#main_visual .control p {margin: 20px 0 30px;font-size:18px;color:#fff;letter-spacing: -0.07em;}
#main_visual .control .cbox {display: inline-block;position:relative;padding: 0 30px;}
#main_visual .control .paging {display:inline-block;}
#main_visual .control .paging .total {}
#main_visual .control .paging .total span {display:inline-block;min-width:20px;line-height: 25px;margin:0 2px;font-size: 14px;font-family: 'score';font-weight:bold; color:rgba(255,255,255,.6);text-align:center;vertical-align:top;}
#main_visual .control .paging .total span.current {;color: #fff;}
#main_visual .control .paging .total span.line {width:80px; font-size:0;}
#main_visual .control .inner {display: inline-block;position: absolute;top: 11px;left: 67px;width: 60px;}
#main_visual .control .slick-dots {display:inline-block;position: relative;width: 100%;height: 1px;background:rgba(255,255,255,.2);vertical-align: middle;}
#main_visual .control .slick-dots:after{display:block; clear:both; visibility:hidden; content:'';}
#main_visual .control .slick-dots li {display:inline-block;float:left;position: absolute;left:0;bottom:0;width:0;height: 100%;background: #fff;}
#main_visual .control .slick-dots li.slick-active {width: 100%;-webkit-animation: ProgressDots 6s linear;animation: ProgressDots 6s linear;}
#main_visual .control .slick-dots li button {display:none;}
#main_visual .control .btnbox {display:inline-block;margin: 0 0 0 10px;vertical-align:top;}
#main_visual .control .btnbox button {display:inline-block;overflow: hidden;position:relative;width:18px;height:18px;margin: 0 2px;padding: 0;background:url(/images/media/main_new/ico_ir.png)no-repeat;font-size:0;vertical-align: top;-webkit-transition:all 0.3s;transition:all 0.3s;}
#main_visual .control .btnbox button:before,
#main_visual .control .btnbox button:after {display:none;}
#main_visual .control .btnbox button.slick-prev{background-position:0 0;}
#main_visual .control .btnbox button.slick-next {background-position:-54px 0;}
#main_visual .control .btnbox button[data-control="stop"]{background-position:-18px 0;}
#main_visual .control .btnbox button[data-control="play"]{background-position:-36px 0;}
#main_visual .control .btnbox2 {display:inline-block;}
#main_visual .control .btnbox2 a {display:block;position: relative;width: 195px;height:70px;line-height:70px;padding: 0 20px;background:#fff;color:#2d2d2d;font-size:14px;}
#main_visual .control .btnbox2 a:before {display:block;position:absolute;right: 18px;top:50%;content:'';width: 6px;height: 6px;margin-top: -5.5px;border-radius: 2px;border:solid #2d2d2d;border-width:2px 2px 0 0;transform:rotate(45deg);-webkit-transform:rotate(45deg);}

#main_visual .scrolldown {position:absolute;right: 40px;top: 50%;z-index: 9;transform: translateY(-50%);-webkit-transform: translateY(-50%);}
#main_visual .scrolldown img {display:block;margin:0 0 10px;}
#main_visual .scrolldown strong {display:block;position:absolute;top: 81px;left: -37px;width:100px;font-size:13px;font-weight: 200;font-family: 'score';color: #fff;transform: rotate(90deg);-webkit-transform: rotate(90deg);}
#main_visual .scrolldown > span {display: block;overflow: hidden;position:relative;width: 2px;height: 120px;background-color: rgba(255,255,255,.2);text-indent: -999em;}
#main_visual .scrolldown > span:after{height: 30px;position: absolute;top: 0;left: 0;right: 0;height: 100%;content: '';background:#fff; -webkit-animation: scrolldown 2s infinite ease-in-out;animation: scrolldown 2s infinite ease-in-out;}


#section1 .group2 {}
#section1 .group2 .box {float:left;position: relative;width:50%;}
#section1 .group2 .box:after {display:block; clear:both; visibility:hidden; content:''; }
#section1 .group2 .box .tit {float:left; width:250px;}
#section1 .group2 .box .contbox {float:left;width:calc(100% - 250px);}
#section1 .group2 .box .contbox:after {display:block; clear:both; visibility:hidden; content:'';}
#section1 .group2 .box1 #notice {position:relative;}
#section1 .group2 .box1 #notice .control {position:absolute;left: -91px;top: 3px;}
#section1 .group2 .box1 #notice .control button {width:18px;height:18px;margin: 0 2px;padding: 0;background:url(/images/media/main_new/ico_ir.png)no-repeat;font-size:0;vertical-align: top;}
#section1 .group2 .box1 #notice .control button.btn_prev {background-position:0 -18px; }
#section1 .group2 .box1 #notice .control button.btn_play {background-position:-36px -18px; }
#section1 .group2 .box1 #notice .control button.btn_stop {background-position:-18px -18px; }
#section1 .group2 .box1 #notice .control button.btn_next {background-position:-54px -18px; }
#section1 .group2 .box1 #notice .grap {overflow:hidden; height:24px;}
#section1 .group2 .box1 #notice .grap ul {position:relative; }
#section1 .group2 .box1 #notice .grap ul li {}
#section1 .group2 .box1 #notice .grap ul li a {display:block;overflow:hidden;position:relative;line-height:24px;padding:0 165px 0 20px;font-size:16px;color:#565656;text-overflow: ellipsis;white-space: nowrap;}
#section1 .group2 .box1 #notice .grap ul li span {display:block; position:absolute; right:80px; top:0; line-height:24px; font-size:16px; color:#565656; }
#section1 .group2 .box2 {}
#section1 .group2 .box2 ul {    margin-top: -8px;}
#section1 .group2 .box2 ul li {display:inline-block;margin-right: 12%;vertical-align:top;}
#section1 .group2 .box2 ul li:last-child {margin:0;}
#section1 .group2 .box2 ul li span {display:inline-block;width:36px;height:36px;margin: 0 10px 0 0;background:url(/images/media/main_new/ico_ir.png)no-repeat;vertical-align:middle;}
#section1 .group2 .box2 ul li.n1 span {background-position:0 -36px ;}
#section1 .group2 .box2 ul li.n2 span {background-position:-36px -36px ;}
#section1 .group2 .box2 ul li.n3 span {background-position:-72px -36px ;}
#section1 .group2 .box2 ul li em {display:inline-block; position:relative; font-size:16px; color:#000; }
#section1 .group2 .box2 ul li em:before {display:block;position:absolute;z-index:-1;content:'';left:0;right:0;bottom:0;width:0;height:12px;background:#dfeeed;transition: all 0.3s;-webkit-transition: all 0.3s;}
#section1 .group2 .box2 ul li a {display:block; width:100%;}
#section1 .group2 .box2 ul li a:hover em,
#section1 .group2 .box2 ul li a:focus em {font-weight:bold;}
#section1 .group2 .box2 ul li a:hover em:before,
#section1 .group2 .box2 ul li a:focus em:before {width:100%;}

#section2 {background:#f8f8f8; }
#section2 .leftit .inner:before {display:block;position:absolute;top: -185px;left: 75px;content:'';width:436px;height:244px;background:url(/images/media/main_new/tit_obj.png)no-repeat;}
#section2 .rightcont {}
#section2 .rightcont .inner {position:relative; height:620px;}
#section2 .rightcont ul {height:100%;}
#section2 .rightcont ul:after {display:block; clear:both; visibility:hidden; content:'';}
#section2 .rightcont ul li {overflow: hidden;float:left;position:relative;box-shadow: 0 0 15px rgba(0,0,0,.3);}
#section2 .rightcont ul li:nth-child(1) {top:60px;width:31%;height: 45%;border-radius: 50px 0 0 0;}
#section2 .rightcont ul li:nth-child(2) {width:calc(41% - 80px);height: 45%;margin:0 40px;}
#section2 .rightcont ul li:nth-child(3) {top:90px;width:28%;height: 38%;}
#section2 .rightcont ul li:nth-child(4) {position:absolute; right:calc(28% + 80px); top:calc(45% + 40px); bottom:45px; width:calc(41% - 120px);}
#section2 .rightcont ul li:nth-child(5) {position:absolute;top:calc(38% + 130px);right:0;bottom:0;width:calc(28% + 40px);height:auto;border-radius: 0 0 50px 0;}
#section2 .rightcont ul li a {display:block;position: relative;width:100%;height:100%;background-size: cover;background-position: center;background-repeat: no-repeat;}
#section2 .rightcont ul li a:before {display:block;position:absolute;content:'';left: 0;top: 0;width:100%;height:100%;background:rgba(0,0,0,.5) url(/images/media/main_new/play.png)no-repeat center;}
#section2 .rightcont ul li a:hover:before, 
#section2 .rightcont ul li a:focus:before {background:rgba(0,0,0,.5);}
#section2 .rightcont ul li a:after {display:block;position:absolute;content:'';left: 0;bottom: 0;width:100%;height: 235px;background:url(/images/media/main_new/bg.png)repeat-x left bottom;}
#section2 .rightcont ul li .cate {position:absolute;right:0;top:0;z-index: 11;width:70px;height:70px;line-height: 1.3;padding: 17px 0 0;text-align:center;color:#fff;font-size:16px;}
#section2 .rightcont ul li .cate1 {background:#3e9e98;}
#section2 .rightcont ul li .cate2 {background:#154f9e;}
#section2 .rightcont ul li .cate3 {background: #487cc3;}
#section2 .rightcont ul li .cate4 {background:#78559a;}
#section2 .rightcont ul li .cate5 {background:#5d4531;}
#section2 .rightcont ul li .info {position:absolute;left:0;bottom:0;z-index: 2;width: 100%;height: auto;padding: 20px 20px 30px;}
#section2 .rightcont ul li .info strong {display:block;overflow:hidden; font-size:20px; color:#fff; text-overflow: ellipsis;white-space: nowrap; transition:all 0.3s;-webkit-transition:all 0.3s;}
#section2 .rightcont ul li a:hover .info strong,
#section2 .rightcont ul li a:focus .info strong {opacity:0;}
#section2 .rightcont ul li .ovbox {opacity:0;position:absolute;left:0;top:0;z-index:10;width:100%;height:100%;padding: 21% 30px 0;background: rgba(0,0,0,.5);text-align:center;transition:all 0.3s;-webkit-transition:all 0.3s;}
#section2 .rightcont ul li a:hover .ovbox,
#section2 .rightcont ul li a:focus .ovbox {opacity:1;}
#section2 .rightcont ul li .ovbox strong {display:block;overflow:hidden; font-size:20px; color:#fff; text-overflow: ellipsis;white-space: nowrap; }
#section2 .rightcont ul li .ovbox .plus {width:100%;font-size:16px;color:#fff;font-weight: normal;transition:all 0.3s;-webkit-transition:all 0.3s;}
#section2 .rightcont ul li .ovbox .plus span {display:block;position:relative;width:50px;height:50px;margin: 18px auto;}
#section2 .rightcont ul li .ovbox .plus span:before,
#section2 .rightcont ul li .ovbox .plus span:after {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
#section2 .rightcont ul li .ovbox .plus span:before {width:100%;height: 1px;background: #fff;}
#section2 .rightcont ul li .ovbox .plus span:after {width: 1px;height:100%;background: #fff;}
#section2 .rightcont .youtubeBox {position:absolute;top:calc(100px + 45%);left:0;bottom: 75px;width: 31%;height:auto;box-shadow: 0 0 15px rgba(0,0,0,.3);}
#section2 .rightcont .youtubeBox a {display:block;width:100%;height:100%;padding: 20px;background: #3e9e98;}
#section2 .rightcont .youtubeBox a:after {display:block; clear:both; visibility:hidden; content:''; }
#section2 .rightcont .youtubeBox .info {float:left;width: 140px; padding:5px 0 0;}
#section2 .rightcont .youtubeBox .info img {}
#section2 .rightcont .youtubeBox .info strong {display:block;line-height:1; margin:15px 0 0; font-family:'score'; font-size:24px; color:#fff; }
#section2 .rightcont .youtubeBox .info strong span {display:block; margin:0 0 5px; font-size:14px; font-weight:normal; }
#section2 .rightcont .youtubeBox .thumb {float:right;width:calc(100% - 140px);height:100%;background-size: 100% auto;background-position: center;background-repeat: no-repeat;}

#section3 {}
#section3 .rightcont {}
#section3 .rightcont .tit {position: relative;text-align:center;}
#section3 .rightcont .tit  img {width:auto; max-width:1000%; height:130px;}
#section3 .rightcont ul {position: relative;z-index: 2;margin: -40px -20px 0;}
#section3 .rightcont ul li { float:left; width:calc(33.33% - 40px); margin:0 20px;}
#section3 .rightcont ul li a { display: block; width:100%; }
#section3 .rightcont ul li .thumb {width: 100%;height:240px;background-size:cover;background-position:center;background-repeat: no-repeat;box-shadow: 0 0 15px rgba(0,0,0,.3);}
#section3 .rightcont ul li .info {padding:30px 25px 0; }
#section3 .rightcont ul li .info strong {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;height: 56px;line-height: 1.4;text-overflow: ellipsis;white-space: normal;font-size:20px;color:#000;}
#section3 .rightcont ul li .info p {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;height: 72px;margin: 15px 0 30px;text-overflow: ellipsis;white-space: normal;font-size:15px;color:#555;}
#section3 .rightcont ul li .info span {display:block;font-size: 14px;color: #888;}

.fp-viewing-MAIN4 #header h1 a span,
.fp-viewing-MAIN5 #header h1 a span {background-image: url(/images/media/common_new/logo2.png);background-image: url(/images/media/common_new/logo2.svg);}
.fp-viewing-MAIN4 #header.on h1 a span,
.fp-viewing-MAIN5 #header.on h1 a span {background-image: url(/images/media/common_new/logo.png);background-image: url(/images/media/common_new/logo.svg);}
.fp-viewing-MAIN4 #header h1 a,
.fp-viewing-MAIN4 #header #snb ul li a,
.fp-viewing-MAIN4 #gnbwrap #tm > li > a,
.fp-viewing-MAIN5 #header h1 a,
.fp-viewing-MAIN5 #header #snb ul li a,
.fp-viewing-MAIN5 #gnbwrap #tm > li > a  {color:#fff;}
.fp-viewing-MAIN4 #header.on h1 a,
.fp-viewing-MAIN4 #header.on #snb ul li a,
.fp-viewing-MAIN4 #gnb.on #gnbwrap #tm > li > a,
.fp-viewing-MAIN5 #header.on h1 a,
.fp-viewing-MAIN5 #header.on #snb ul li a,
.fp-viewing-MAIN5 #gnb.on #gnbwrap #tm > li > a {color:#0a0a0a;}
.fp-viewing-MAIN4 #main-menu li em {color: #c1c0c0;}
.fp-viewing-MAIN4 #main-menu li.active em{color:#3e9e98}
.fp-viewing-MAIN4 .ftop {display:none;}
#section4 {background:#283648; }
#section4 .leftit .inner {top: 53%;}
#section4 .leftit .inner:before {display:block; position:absolute; left:215px; top:-185px; content:''; width:441px; height:265px; background:url(/images/media/main_new/tit_obj2.png)no-repeat;}
#section4 .leftit strong,
#section4 .leftit p,
#section4 .leftit p span {color:#fff; }
#section4 .leftit ul {max-width:235px;margin:25px 0 0; }
#section4 .leftit ul li {border-bottom:1px solid rgba(255,255,255,.2); }
#section4 .leftit ul li a {display:block;line-height:55px;background: none;font-size:16px;color:#fff;}
#section4 .leftit ul li.n1 a {background: url(/images/media/main_new/arr.png)no-repeat right 38%;}
#section4 .leftit ul li span {display:inline-block;position: relative;width:37px;height:37px;margin: -2px 20px 0 0;border-radius: 50%;background: #3c516c;vertical-align: middle;transition:all 0.3s;-webkit-transition:all 0.3s;}
#section4 .leftit ul li span:before {display:block; position:absolute; content:''; width:100%; height:100%; background:url(/images/media/main_new/sns.png)no-repeat;}
#section4 .leftit ul li.n2 span:before {background-position:0 -37px;}
#section4 .leftit ul li.n3 span:before {background-position:0 -74px;}
#section4 .leftit ul li.n1 a span{background:#6eb842}
#section4 .leftit ul li.n1 a:hover span,
#section4 .leftit ul li.n1 a:focus span {background:#6eb842}
#section4 .leftit ul li.n2 a:hover span,
#section4 .leftit ul li.n2 a:focus span {background:#5d74bd}
#section4 .leftit ul li.n3 a:hover span,
#section4 .leftit ul li.n3 a:focus span { background: #d6249f; background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);}

#section4 .rightcont {}
#section4 .rightcont ul {margin:0 -20px;}
#section4 .rightcont ul li {float:left;width:calc(33.33% - 40px);margin:0 20px; box-shadow: 0 0 15px rgba(0,0,0,.3);}
#section4 .rightcont ul li a {display:block;position: relative;width:100%;padding: 50px 40px;background:#fff;}
#section4 .rightcont ul li span {display:block; margin:0 0 10px;color:#2cb149; font-size:15px;  }
#section4 .rightcont ul li strong {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;height: 56px;line-height: 1.4;text-overflow: ellipsis;white-space: normal;font-size:20px;color:#000;}
#section4 .rightcont ul li p {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 5;overflow: hidden;height: 120px;margin: 15px 0 30px;text-overflow: ellipsis;white-space: normal;font-size:15px;color:#555;}
#section4 .rightcont ul li .date {}

.ftop {position:absolute; right:25px; top:-32.5px;width:65px; height:65px; padding:11.5px; border-radius:50%; background:rgba(62,158,152,.3); font-size:0;}
.ftop a {display:block; width:100%; height:100%; border-radius:50%; background:#3e9e98 url(/images/media/main_new/arr2.png)no-repeat center; }



@media(max-height:855px){
    #section1 .group1,
    #main_visual .viewer_area .imgbox {height:560px;}
}

@media(max-width:1880px){
    #main-menu {display:none;}
}

@media(max-width:1550px){
    .section .leftit,
    .section .leftit .inner {width:400px;}
    .section .rightcont {width:calc(100% - 400px);}
    #section1 .group1 .box1 {width:520px;}
    #section1 .group1 .box2 {width:calc(100% - 520px);}
    #section1 .group2 .box2 ul li {margin-right:10%;}
}

@media(max-width:1499px){
    #section1 .group1 {height:450px;margin: 50px 0 40px;}
    #section1 .group1 .box1 {width:400px; padding:85px 0 0; }
    #section1 .group1 .box1 strong {font-size:35px;}
    #section1 .group1 .box1 p {font-size:16px;}
    #section1 .group1 .box1 .searchFrm {width:310px;}
    #section1 .group1 .box1 .searchFrm .submit input {width:40px; font-size:0;}
    #main_visual {border-radius:0 0 60px 0; }
    #main_visual .viewer_area .imgbox {height:450px;}
    #main_visual .viewer_area .imgbox .tip {right:auto;left: 345px;bottom: 10px;}
    #main_visual .control .cbox {padding: 0 8px 0 13px;}
    #main_visual .control .inner {left: 40px;width: 40px;}
    #main_visual .control .paging .total span.line {width: 45px;}
    #main_visual .control .btnbox {margin:0}
    #main_visual .control .btnbox button {margin:0;}
    #main_visual .control .btnbox2 a {width: 145px;height:60px;padding: 0 15px;line-height:60px;}
    #main_visual .control .btnbox2 a:before {right:13px;}
    #main_visual .scrolldown {display:none;}
    
    #section1:before {display:block; position:absolute; left:0; top:0;content:''; width:50%; height:100%; background: #f7f9f9;}
    #section1 .group1:before {display:none;}
    #section1 .group1 .box2 {width:calc(100% - 400px);}

    #section1 .group2 .box .tit {float:none; width:100%;}
    #section1 .group2 .box .contbox {float:none;width:100%;margin: 30px 0 0;}
    #section1 .group2 .box1 #notice .grap {}
    #section1 .group2 .box1 #notice .grap ul li a {padding: 0 130px 0 0;}
    #section1 .group2 .box1 #notice .grap ul li span {top: -1px;right: 30px;}
    #section1 .group2 .box1 #notice .control {left:170px;top: -50px;}
    
    #section1 .group2 .box2 {padding-left:30px;}
    #section1 .group2 .box2 ul.contbox {margin: 30px 0 0;}
    #section1 .group2 .box2 ul li {float:left; width:33.33%; margin:0;} 
    
    
    .section .leftit, .section .leftit .inner {width:300px;}
    .section .leftit strong {font-size:32px;}
    .section .leftit p {margin:20px 0 0;font-size:16px;}
    .section .leftit p span {font-size:16px;}
    .section .leftit .btnbox {margin:40px 0 0;}
    .section .leftit .btnbox a {font-size:17px;}
    .section .rightcont {width:calc(100% - 300px);} 
    

    #section2 .leftit .inner:before {top: -119px;width:232px;height:130px;background-size:232px auto;}
    #section2 .rightcont .inner {overflow: hidden;overflow-x: auto;height: auto;white-space: nowrap;}
    #section2 .rightcont ul {display:inline-block;vertical-align:top;}
    #section2 .rightcont ul li:nth-child(1),
    #section2 .rightcont ul li:nth-child(2),
    #section2 .rightcont ul li:nth-child(3),
    #section2 .rightcont ul li:nth-child(4),
    #section2 .rightcont ul li:nth-child(5) {display:inline-block;float: none;position:relative;left:auto;right:auto;top:auto;bottom: auto;width:310px;height:230px;margin:0 20px 0 0;border-radius: 0;vertical-align:top;}
    #section2 .rightcont ul li .info {padding:20px;}
    #section2 .rightcont .youtubeBox {display:inline-block; float: none;position:relative;left:auto;right:auto;top:auto;bottom: auto;width:310px;height:230px;margin:0 20px 0 0;border-radius: 0; vertical-align:top;}
    #section2 .rightcont .youtubeBox .info {float:none;padding: 0;width: 100%;}
    #section2 .rightcont .youtubeBox .info strong {margin: 5px 0 5px;font-size: 20px;}
    #section2 .rightcont .youtubeBox .info strong span {display:inline-block; margin-right:5px;}
    #section2 .rightcont .youtubeBox .thumb {float:none;width: 100%;height: 100px;background-size: auto 100%;}
    #section2 .rightcont ul li .ovbox {display:none;}
    #section2 .rightcont ul li a:hover .info strong,
    #section2 .rightcont ul li a:focus .info strong {opacity:1;}
    #section2 .rightcont ul li a:hover:before, 
    #section2 .rightcont ul li a:focus:before {background: rgba(0,0,0,.5) url(/images/media/main_new/play.png)no-repeat center;}

    #section3 .cont {margin: 45px 0 70px;}
    #section3 .rightcont .tit {padding-left:220px;}
    #section3 .rightcont ul {overflow: hidden;overflow-x: auto;margin: -40px 0 0;white-space: nowrap;}
    #section3 .rightcont ul li {display:inline-block; float:none; width:390px; margin:0 20px 0 0; vertical-align:top;}
    #section3 .rightcont ul li .thumb {height:220px;}
    #section3 .rightcont ul li .info {padding:20px 20px;}
    #section3 .rightcont ul li .info p {-webkit-line-clamp: 2;height: 48px;}
    
    
    #section4 .leftit .inner:before {left:110px; top:-115px;}
    #section4 .rightcont ul {overflow: hidden;overflow-x: auto;margin: 0;white-space: nowrap;}
    #section4 .rightcont ul li {display:inline-block; float:none; width:390px; margin:0 20px 0 0; vertical-align:top;}
}

@media(max-width:1199px){
    #main_visual .viewer_area .imgbox .tip {bottom: 80px;left: 20px;}
}

@media(max-width:1023px){
	html.fp-enabled, .fp-enabled body {overflow:visible;}
    .fp-tableCell,
    .section {display:block;height:auto !important;}

    .fp-viewing-MAIN4 .ftop {display:block;}

    #section1 {padding: 100px 0 20px;}
    #section1 .group1 {height:auto;margin: 0;}
    #section1 .group1 .box1 {float:none;width:100%;padding: 0;text-align:center;}
    #section1 .group1 .box1 .searchFrm {display:none;}
    #section1 .group1 .box1 p {display:none;}
    #section1 .group1 .box2 {float:none; width:100%; }
    #main_visual {margin: 0 0 40px;border-radius:0;}
    #main_visual .viewer_area .imgbox {height: 350px;}
    #main_visual .viewer_area .imgbox .tip {bottom: 10px;left: 365px;}
    #main_visual .control .btnbox2 a {width: 165px;}

    #section1 .group2 .box {float:none; width:100%;}
    #section1 .group2 .box1 #notice .control {left: -91px;top: 3px;}
    #section1 .group2 .box1 .tit {float:left; width:250px;}
    #section1 .group1 .box1 strong {margin:10px 0 20px}
    #section1 .group2 .box1 .contbox {float:left;width:calc(100% - 250px);margin: 0;}
    #section1 .group2 .box2 {padding:0; margin:20px 0;}
    #section1 .group2 .box2 .tit {display:none;}
    #section1 .group2 .box2 ul {text-align:center; }
    #section1 .group2 .box2 ul li {display:inline-block; float:none; width:auto; margin:0 20px;}
    #section1 .group2 .box2 ul li:last-child {margin:0 20px;}

    .section .cont {margin:95px 0;} 
    .section .leftit {float:none; width:100%;}
    .section .leftit .inner {position:relative;top: auto;width:100%;height:auto;margin: 0 0 25px;transform: none;-webkit-transform: none;}
    .section .leftit .inner:after {display:block; clear:both; visibility:hidden; content:''; }
    .section .leftit strong {float:left;line-height: 1.5;font-size: 25px;}
    .section .leftit p {display:none; }
    .section .leftit .btnbox {float:right;margin: 8px 0 0;}
    .section .leftit .btnbox a {font-size:15px;}
    .section .rightcont {float:none;width:100%;}
    
    #section2 .leftit .inner:before {top: -45px;left: 35px;}
    #section2 .rightcont ul li:nth-child(1), #section2 .rightcont ul li:nth-child(2), #section2 .rightcont ul li:nth-child(3), #section2 .rightcont ul li:nth-child(4), #section2 .rightcont ul li:nth-child(5) {width:280px; height:210px;}
    #section2 .rightcont ul li a:before {background-size:27px auto;}
    #section2 .rightcont ul li .cate {width:50px;height:50px;padding: 9px 0 0;font-size:14px;}
    #section2 .rightcont ul li .info strong {font-size:16px;}
    #section2 .rightcont .youtubeBox {width:280px; height:210px;}
    #section2 .rightcont .youtubeBox a {padding:10px 20px 0}
    #section2 .rightcont ul li a:hover:before, 
    #section2 .rightcont ul li a:focus:before {background: rgba(0,0,0,.5) url(/images/media/main_new/play.png)no-repeat center;background-size: 27px auto;}
    
    #section3 .cont {padding:95px 0;margin: 0;}    
    #section3 .rightcont .tit {display:none;}
    #section3 .rightcont ul {margin:0;}
    #section3 .rightcont ul li {width: 320px;}
    #section3 .rightcont ul li .thumb {height:155px;}
    #section3 .rightcont ul li .info strong {height: 46px;font-size:17px;}
    #section3 .rightcont ul li .info p {margin:10px 0 5px;}
    
    .fp-viewing-MAIN4 #header h1 a span,
    .fp-viewing-MAIN5 #header h1 a span {background-image: url(/images/media/common_new/logo.png);background-image: url(/images/media/common_new/logo.svg);}
    .fp-viewing-MAIN4 #header h1 a,
.fp-viewing-MAIN4 #header #snb ul li a,
.fp-viewing-MAIN4 #gnbwrap #tm > li > a,
.fp-viewing-MAIN5 #header h1 a,
.fp-viewing-MAIN5 #header #snb ul li a,
.fp-viewing-MAIN5 #gnbwrap #tm > li > a  {color:#0a0a0a;}
    #section4 .leftit .inner {top:auto;}
    #section4 .leftit .inner:before {left: -20px;top: -50px;}
    #section4 .leftit ul {display: block;float: right;margin: 0;}
    #section4 .leftit ul li {display:inline-block;margin: 0 5px;border:none;vertical-align: top;}

    #section4 .leftit ul li a {line-height:37px;font-size:0; }
    #section4 .leftit ul li.n1 a {background:none;}
    #section4 .leftit ul li.n1 a span{background: #3c516c;}
    #section4 .leftit ul li span {margin:0;}
    #section4 .rightcont ul li {width:320px;}
    #section4 .rightcont ul li a {padding:35px 40px;}
    #section4 .rightcont ul li strong {height: 46px;font-size:17px;}
    #section4 .rightcont ul li p{margin:10px 0 5px;}


}

@media(max-width:767px){
    .section .cont {margin:60px 0;} 
    #section1 .group2 .box1 .tit {float:none; width:100%;}
    #section1 .group2 .box1 .contbox {float:none;width:100%;margin: 15px 0 0;}
    #section1 .group2 .box1 #notice .control {left:170px;top: -36px;}
    #main_visual {padding:0 0 50px; background:#fff;}
    #main_visual .viewer_area .imgbox {height:300px;}
    #main_visual .viewer_area .imgbox .tipbox {position:absolute;left: 0;bottom: 15px;width: 100%;text-align: center;}
    #main_visual .viewer_area .imgbox .tip {position:static; }
    #main_visual .control .btnbox2 a {height:50px; line-height:50px; }

    #section2 .rightcont ul li:nth-child(1), #section2 .rightcont ul li:nth-child(2), #section2 .rightcont ul li:nth-child(3), #section2 .rightcont ul li:nth-child(4), #section2 .rightcont ul li:nth-child(5) {width:240px; height:180px;}

    #section3 .cont {padding:60px 0;}
    #section3 .rightcont ul li {width:240px;}
    #section3 .rightcont ul li .thumb {height:140px;}
    
    #section4 .leftit .inner:before {display:none;}
    #section4 .rightcont ul li {width:240px;}
    #section4 .rightcont ul li a {padding:30px 30px;}
}

@media(max-width:580px){
    #section1 .group1 .box1 strong {font-size: 28px;}
    #section1 .group2 .box2 ul li {float:left;width:50%;padding-left: 10px;margin:0 0 10px;text-align:left;}
    #section1 .group2 .box2 ul li:last-child {margin: 0;}
    #section1 .group2 .box2 ul li em {font-size:15px;}
    #main_visual .viewer_area .imgbox {height:250px;}
    #main_visual .control .inner {display:none;}
    #main_visual .control .paging .total span.line {position:relative; width: 13px;min-width: auto;}
    #main_visual .control .paging .total span.line:before {display:block; position:absolute; left:0; top:10px;content:''; width:10px; height:1px; background:#8bc5c1; }
    #main_visual .control .cbox {padding:0 5px}
    #main_visual .control .btnbox2 a {width:145px;}

    #section1 .group2 .box1 #notice .grap ul li a {padding: 0 90px 0 0;}
    #section1 .group2 .box1 #notice .grap ul li span {right: 0;}
}