@charset "utf-8";
@import 'contents2.css';

 /* ==============================
 * login
 * ============================== */
.loginSliderBox{position: absolute; width: 100%; height: 100%; min-height: 720px; background: #000; z-index: 4; overflow: hidden; min-width: 1364px;}
/*.loginSliderBox img{width: auto; height: 100%;}
@media screen and (min-width: 1750px) {
    .loginSliderBox img{width: 100%; height: auto;}
}*/
.loginSliderBox .bannLink .imgArea{background-size: cover; background-repeat: no-repeat; background-position: center center;}
.loginSliderBox .bannLink .imgArea.bann1{background-image:url(../images/content/bann_login1.jpg);}
.loginSliderBox .bannLink .imgArea.bann2{background-image:url(../images/content/bann_login2.jpg);}
.loginSliderBox .bannLink .imgArea.bann3{background-image:url(../images/content/bann_login3.jpg);}
.loginSliderBox .bannLink .imgArea.bann4{background-image:url(../images/content/bann_login4.jpg);}
.loginSliderBox .bannLink{position: relative;}
.loginSliderBox .bannLink .txtTit{position: absolute; top: 90px; text-align: center; color: #fff; width: 100%; font-size: 24px; font-weight: normal;}
.loginSliderBox .pagination {position: absolute; top: 700px; text-align: center; width: 100%; z-index: 2; bottom: 0; right: 0;}
.loginSliderBox .pagination .swiper-pagination-bullet{background: transparent; border:2px solid #fff; width: 10px; height: 10px; opacity: 1;}
.loginSliderBox .pagination .swiper-pagination-bullet-active{background: #fff;}
.loginSliderBox .pagination span ~ span{margin-left: 8px;}


.login{height: 100%;}
.login input::-webkit-input-placeholder {color: #fff;}
.login input::-moz-placeholder {color: #fff; }
.login input:-ms-input-placeholder {color: #fff; }
.login input:-moz-placeholder {color: #fff; }
.login #container{padding: 0;}
.login #contents {padding: 0; margin: 0 auto;}
.login .logoInner {position: absolute; top: 180px; left: 272px; z-index: 4; }
/* 1364 이하일때 로그인창 고정 */
@media screen and (min-width: 1364px) {
    .login .logoInner {position: absolute; top: 180px; left: 50%; margin-left: -410px; z-index: 4; }
}
.login .logoLogin {width: 77px; height: 46px; text-indent: -9999px; background: url('../images/content/logo_login.png') no-repeat center center; position: absolute; left: 36px; top: 36px; z-index: 4;}
.login .boxLoginWrap {width: 820px; margin: 0 auto; border: 1px solid rgba(255,255,255,0.4); background: rgba(0,0,0,0.25); overflow: hidden;}


.boxLoginWrap .boxInner {float: left; position: relative; width: 50%; min-height: 400px; padding: 40px 60px 30px;}
.boxLoginWrap .boxInner:first-child {border-right: 1px solid rgba(255,255,255,0.8);}
.boxLoginWrap .boxInner .titleBoxCon {margin-bottom: 31px; font-size: 22px; color: #fff;}

.boxLoginWrap .boxInner .formList {margin-bottom: 18px;}
.boxLoginWrap .boxInner .formList li + li {margin-top: 10px;}
.boxLoginWrap .boxInner .formList input[type=text],
.boxLoginWrap .boxInner .formList input[type=password] {width: 100%; height: 32px; padding: 0 5px; line-height: normal; background: transparent; border: none; border-bottom: 1px solid #c5c5c5; border-radius: 0; outline: none; color: #fff;}
.boxLoginWrap .boxInner .formList label{font-size: 10px; color: #1cb0a9; opacity: 0;}
.boxLoginWrap .loginFormWrap .chkRem label{font-size: 13px; color: #fff; position: relative;}
.boxLoginWrap .loginFormWrap .chkRem input{display: none;}
.boxLoginWrap .loginFormWrap .chkRem label:before{content:''; width: 13px; height: 9px; display: inline-block; vertical-align: middle; margin:-2px 10px 0 2px;}
.boxLoginWrap .loginFormWrap .chkRem label:after{content:''; width: 16px; height: 16px; border: 1px solid rgba(197,197,197,0.50); display: inline-block; position: absolute; left: 0; top: 1px;}
.boxLoginWrap .loginFormWrap .chkRem input:checked + label:before{background: url(../images/common/form_img.png) 0 -38px no-repeat; }
.boxLoginWrap .loginFormWrap .chkRem input:checked + label:after{border: 1px solid #1cb0a9;}

.boxLoginWrap .boxInner .btnArea {position: absolute; left: 0; right: 0; bottom: 30px;}
.boxLoginWrap .boxInner .btnBasic {min-width: 288px;}

.boxLoginWrap .selForm {margin-bottom: 25px; position: relative;}
.boxLoginWrap .selForm input[type=text]{background:rgba(0,0,0,0.15); border:1px solid rgba(197,197,197,0.50); width: 100%; color: #fff; font-size: 13px; cursor: pointer; }
.boxLoginWrap .selForm input + i{width: 9px; height: 5px; display: block; background: url(../images/common/form_img.png) -62px 0 no-repeat; position: absolute; top:15px; right: 12px;}
.boxLoginWrap .selPopupWrap{position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 100; display:none;}
.boxLoginWrap .selPopupWrap .popupBg{width: 100%; height: 100%; background: rgba(0,0,0,0.70);}
.boxLoginWrap .selPopupWrap .selPopup{position: absolute; top:50%; left: 50%;  width: 340px; height: 540px; margin: -270px 0 0 -170px; background: #fff; border: 1px solid #c5c5c5; border-radius: 2px;}
.boxLoginWrap .selPopupWrap .selPopup > p{width: 100%; font-size: 19px; color: #262626; height: 58px; line-height: 57px; border-bottom: 1px solid #c5c5c5; text-align: center;}
.boxLoginWrap .selPopupWrap .selPopup ul{padding: 20px 0; height: 482px; overflow-y: auto;}
.boxLoginWrap .selPopupWrap .selPopup ul li{height: 34px; line-height: 34px;}
.boxLoginWrap .selPopupWrap .selPopup ul li:hover{background: #f0f0f0;}
.boxLoginWrap .selPopupWrap .selPopup ul li label{font-size: 14px; padding-left: 35px; cursor: pointer; position: relative; width: 100%; height: 34px; display: block;}
.boxLoginWrap .selPopupWrap .selPopup ul li input{display: none;}
.boxLoginWrap .selPopupWrap .selPopup ul li input:checked + label{color: #1cb0a9;}
.boxLoginWrap .selPopupWrap .selPopup ul li input:checked + label:before{content: ''; background: url(../images/common/form_img.png) 0 -38px no-repeat; width: 13px; height: 9px; display: block; position: absolute; top: 12px; left: 11px;}

.boxLoginWrap .userCheck {padding: 27px 0 30px; border-top: 1px solid rgba(255,255,255,0.80); font-size: 0; line-height: 0; text-align: center;}
.boxLoginWrap .userCheck > li {display: inline-block;}
.boxLoginWrap .userCheck > li + li {margin-left: 97px;}
.boxLoginWrap .userCheck > li a {display: block; padding-top: 30px; color: #fff; font-size: 13px; line-height: 1; text-decoration: none;}
.boxLoginWrap .userCheck > li a:before {left: 50%; top: 0; }
.boxLoginWrap .userCheck > li a.findId:before {margin-left: -9px;}
.boxLoginWrap .userCheck > li a.reissuePw:before {margin-left: -7px;}
.boxLoginWrap .userCheck > li a.reqUnlock:before {margin-left: -9px;}


.login .swiper-wrapper{height: 100%;}
.login .login-bann-slider{height: 100%;}
.login .swiper-slide .imgArea{height: 100%; display: block;}
.login .swiper-slide .bannLink{height: 100%; display: block;}



/* ==============================
 * 이용약관동의 단독 페이지
 * ============================== */

#wrap.agree{width: 100%; height: 100%; background: #1d262e;}
.agree #container{width: 933px; background:none; margin: 0 auto;}
.agree h1{display: block; margin: 100px 0 25px; font-size: 24px; color: #fff; font-weight: normal; text-align: center;}
.agree h1 p{font-size: 13px; color: #fc955a; margin-top: 10px;}
.agree h2{font-size: 16px; color: #262626; font-weight: normal;margin-bottom: 5px;}
.agree h2 + P{font-size: 13px; color: #666; margin-bottom: 10px;}
.agree h2 + P em{color: #fc955a; }

.agree #contents{background:#fff; padding: 0; border-radius: 2px;}
.agree .conWrap{overflow: hidden; padding: 20px 0;}

.agree .agree_box,.agree .pwChange{width: 50%; float: left; padding: 0 30px;}
.agree .agree_box .scroll_box {overflow-y:scroll; height:124px; padding:10px; color: #9c9c9c; font-size: 12px; line-height:18px; border:1px solid #b5b5b5; background:#fff;}
.agree .agree_box .agreeChkWrap{margin-top: 20px;}
.agree .agree_box .agreeChkWrap .rdo_box{overflow: hidden;}
.agree .agree_box .agreeChkWrap .rdo_box storng{font-size: 16px; color: #262626; float: left;}
.agree .agree_box .agreeChkWrap .rdo_box .radioGroup{float: right;}
.bul_tip {margin:15px 0; padding:0 0 0 9px; font-size:12px; line-height:20px; color:#9c9c9c;}
.bul_tip li {text-indent:-9px;}
.bul_tip li:before {content:'·'; display:inline-block; padding:0 0 0 9px; }
.bul_tip li ~ li{margin-top: 10px;}
.bul_tip strong,.agree .star_tip a{color: #fc955a; text-decoration: underline;}

.star_tip{margin:0 0 15px 0; padding:0 0 0 9px; font-size:12px; line-height:20px; color:#9c9c9c;}
.star_tip li {text-indent:-9px;}
.star_tip li:before {content:'*'; display:inline-block; padding:0 0 0 9px; vertical-align: middle;}
.star_tip li ~ li{margin-top: 10px;}
.star_tip strong,.star_tip a{color: #fc955a; text-decoration: underline;}

.agree .pwChange{border-left: 1px solid #e6e6e6;}
.agree .pwChange .pwList *{width: 100%;}
.agree .pwChange .pwList li ~ li{margin-top: 3px;}
.agree .pwChange .pwList + p{font-size: 11px; color: #fc955a; margin: 5px 0 15px;}
.agree .btnArea{padding: 30px 0;}



/* ==============================
 * 인증
 * ============================== */

#wrap.certification{width: 100%; height: 100%; background: #1d262e;}
.certification #container{width: 480px; background:none; margin: 0 auto;}
.certification #contents{padding-top: 55px;}
.certification h1{display: block; width: 85px; height: 61px; background: url('../images/common/header_logo.png') no-repeat center center; text-indent: -9999px; margin: 100px auto 0;}
.certification .titTxt{text-align: center; color: #fff; margin-bottom: 30px; font-size: 24px;}
.certification .txtArea{background: #fff; border-radius: 2px; padding: 35px 70px;}
.certification .txtArea input{width: 100%;}
.certification .txtArea .time{margin-top: 10px; font-size: 12px; color: #9c9c9c;}
.certification .txtArea .time span{color: #fc955a;}
.certification .txtArea .btnArea{margin-top: 25px;}
.certification .txtArea .btnArea button{width: calc(50% - 3px);}
.certification .txtArea .btnArea button:last-of-type{margin-left: 6px;}
.certification .bul_tip{border-top: 1px solid #e6e6e6; margin: 25px 0 0 0; padding-top: 25px; color: #9c9c9c;}
.certification .bul_tip li ~ li{margin-top: 2px;}

 /* ==============================
 * main
 * ============================== */


.mainSection{margin-bottom: 40px;}
.mainSection > [class*=titleCont] {position: relative; margin-bottom: 33px; padding-top: 23px; line-height: 1; font-weight: 100; font-size: 20px;}
.mainSection > [class*=titleCont]:before {content: ''; display: block; position: absolute; left: 50%; top: 0; width: 18px; height: 4px; margin-left: -9px; /* background: #ff7e00; */}
.mainSection > [class*=titleCont] a{font-weight: 100;}
.mainSection > [class*=titleCont] strong{font-weight: bold; font-size: 21px;}


.mainBannerWrap:after {content: ''; display: block; clear: both;}
.mainBannerWrap .mainSliderBox {float: left;}
/*.mainBannerWrap .mainBannBox {float: left;}
.mainBannerWrap .mainBannBox > li {float: left;}*/

.mainBannerWrap .bannLink {display: block; position: relative; text-decoration: none; overflow: hidden;}
.mainBannerWrap .bannLink:after {content: ''; display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; background: rgb(0,0,0); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=0 ); opacity: 0.6;}
.mainBannerWrap .contArea {position: absolute; z-index: 2; width: 100%;}
.mainBannerWrap .contArea .txtCate {color: #fff; line-height: 1; display: none;}
.mainBannerWrap .contArea .tit {text-align:left; display: block; margin: 21px 0; color: #fff; line-height: 1.25; max-height: 94px; overflow: hidden;  word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; font-weight: normal;}
.mainBannerWrap img {width: 100%; height: 100%;}
.mainBannerWrap .btnRound {display: block; position: absolute; border: 1px solid #fff; color: #fff; font-size: 14px; background: rgba(0,0,0,0.2); text-align: center; z-index: 2; transition: all .3s ease;}
.mainBannerWrap .bannLink .btnRound:hover {border: 1px solid #59a9b4; background:#59a9b4; text-decoration: none; box-shadow:14px 0px 16px rgba(0,0,0,0.2);}

.mainBannerWrap .mainSliderBox {position: relative; overflow: hidden;}
.mainBannerWrap .mainSliderBox .contArea {top: 375px; padding: 0 30px 0 30px;}
.mainBannerWrap .mainSliderBox .contArea .txtCate {font-size: 18px; margin-bottom:15px; display: none;}
.mainBannerWrap .mainSliderBox .contArea .tit {margin: 0px 0px 40px 0; font-size: 36px; text-align: left; font-weight: normal;} 
/*.mainBannerWrap .mainSliderBox .contArea .txt{font-size: 15px; color: #fff; line-height: 1.73; overflow: hidden; width: 100%; height: 50px; display: inline-block; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}*/
.mainBannerWrap .mainSliderBox .contArea .txt{display: none;}
.mainBannerWrap .mainSliderBox .btnRound {bottom: 30px; left: 25px; width: 152px; height: 48px; border-radius: 24px; line-height: 46px;}
.mainBannerWrap .mainSliderBox .bannLink{height: 550px;}

.pagination {position: absolute; bottom: 20px; right: 30px; z-index: 10;}
.pagination .swiper-pagination-bullet {display: inline-block; width: 7px; height: 7px; margin-left: 6px; border-radius: 100%; background: #eee; opacity: 1;}
.pagination .swiper-pagination-bullet-active {background: rgba(248,157,40,1);}

.paginationNum{position: absolute; bottom: 10px; text-align: center; color: #fff;}

.mainBannBox .contArea .txtCate {font-size: 14px;}
.mainBannBox .contArea .tit {font-size: 20px; max-height: 50px; margin-top: 0px;padding: 0 20px 0 20px;}
.mainBannBox .btnRound {left: 30px; bottom: 30px; width: 126px; height: 42px; border-radius: 21px; line-height: 40px;}


.mainBannerWrap[class*=column] .mainSliderBox {width: 100%; height: 100%;}

.mainBannerWrap.column1 > ul > li{width: 100%;}
.mainBannerWrap.column1 > ul > li ~ li{display: none;}

.mainBannerWrap.column2 > ul > li{float: left;}
.mainBannerWrap.column2 > ul > li:nth-child(1){width: 854px; height: 550px; border-right: 1px solid #fff;}
.mainBannerWrap.column2 > ul > li:nth-child(2){width: 426px; height: 550px;}
.mainBannerWrap.column2 > ul > li:nth-child(2) ~ li{display: none;}

.mainBannerWrap.column2 .mainBannBox .contArea{top:418px;}
/*.mainBannerWrap.column2 .mainBannBox .contArea .tit{max-height: 100px;}*/


.mainBannerWrap.column3 > ul > li{float: left;}
.mainBannerWrap.column3 > ul > li:first-child{width: 854px; height: 550px; border-right: 1px solid #fff;}
.mainBannerWrap.column3 > ul > li:nth-child(2){border-bottom: 1px solid #fff;}
.mainBannerWrap.column3 > ul > li:nth-child(2),.mainBannerWrap.column3 > ul > li:nth-child(3){display: block; width: 426px; float: right; height: 275px;}
.mainBannerWrap.column3 > ul > li:nth-child(3) ~ li{display: none;}
.mainBannerWrap.column3 .mainBannBox .contArea{top: 142px;}


.mainBannerWrap.column4 > ul > li{float: left;}
.mainBannerWrap.column4 > ul > li:first-child{width: 640px; height: 550px; border-right: 1px solid #fff;}
.mainBannerWrap.column4 > ul > li:nth-child(2){width: 320px; height: 550px; border-right: 1px solid #fff;}
.mainBannerWrap.column4 > ul > li:nth-child(3){border-bottom: 1px solid #fff;}
.mainBannerWrap.column4 > ul > li:nth-child(3),.mainBannerWrap.column4 > ul > li:nth-child(4){display: block; width: 320px; height: 275px; float: right;}
.mainBannerWrap.column4 > ul > li:nth-child(5){display: none;}
/*.mainBannerWrap.column4 .mainSliderBox .contArea .txt{width: 380px;}*/
.mainBannerWrap.column4 .mainSliderBox .contArea{top: 383px;}
.mainBannerWrap.column4 .mainSliderBox .contArea .tit{font-size: 32px; max-height: 85px; margin-bottom: 40px}
.mainBannerWrap.column4 > ul > li:nth-child(2) .contArea{top:383px;}
.mainBannerWrap.column4 > ul > li:nth-child(2) .contArea .txtCate{font-size: 18px; margin-bottom: 15px;}    
.mainBannerWrap.column4 > ul > li:nth-child(2) .contArea .tit{display: block; margin: 12px 0; color: #fff; line-height: 1.25; word-break: break-all; word-wrap: break-word; max-height: 85px; overflow: hidden; font-size: 32px; margin: 0px 0px 15px 0;}
/*.mainBannerWrap.column4 > ul > li:nth-child(2) .contArea .txt{display: block;font-size: 15px; color: #fff; line-height: 1.73; overflow: hidden; height: 50px; width: 249px; height: 50px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}*/
.mainBannerWrap.column4 > ul > li:nth-child(2) .contArea .txt{display: none;}


.mainBannerWrap.column5 > ul > li{float: left; position:relative; z-index:10;}
.mainBannerWrap.column5 > ul > li:first-child{width: 640px; height: 550px; border-right: 1px solid #fff;}
.mainBannerWrap.column5 > ul > li:first-child ~ li{width: 320px; height: 275px; border-right: 1px solid #fff; border-bottom:1px solid #fff;}
.mainBannerWrap.column5 > ul > li:nth-child(4){border-bottom: none !important;}
.mainBannerWrap.column5 > ul > li:nth-child(5){border:none !important;}
.mainBannerWrap.column5 > ul > li:hover {z-index:0;}


.mainBannerWrap.column1 .mainSliderBox .bannLink{height: 550px;}
.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum{position:absolute; bottom: 110px; left: 47px; font-size: 0; line-height: 0; overflow: hidden; z-index: 2;}
.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum li {line-height: 18px; float: left;}
.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum li + li {margin-left: 25px;}
.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum em {color: #fff; font-size: 13px; vertical-align: middle; line-height: 18px;}

.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum .view .icoIr:before {background-position: -121px -429px;}
.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum .reply .icoIr:before {background-position: -153px -430px;}
.mainBannerWrap.column1 .mainSliderBox .bannLink .actNum .share .icoIr:before {background-position: -185px -430px;}



/*.mainBannerWrap.column5 .mainSliderBox {width: 50%;}
.mainBannerWrap.column5 .mainSliderBox .bannLink {height: 640px;}*/
/*.mainBannerWrap.column5 .mainBannBox {width: 100%;}
.mainBannerWrap.column5 .mainBannBox li {width: 100%;}*/

/*.mainBannerWrap.column5 .mainBannBox li:nth-child(3) .bannLink,
.mainBannerWrap.column5 .mainBannBox li:nth-child(4) .bannLink {border-top: 1px solid #fff;}*/
.mainBannBox .bannLink {overflow:hidden; height: 100%;}
.mainBannBox .contArea {top: 142px; padding: 0 40px 0 30px; margin-top: 0px;}

.listTypeCol1[class*=swiper-box] {position: relative; width: 1280px;}
.listTypeCol1[class*=swiper-box] .listWrap {overflow: hidden; margin-left: 0px;}
.listTypeCol1[class*=swiper-box] .listWrap .listBox {margin-left: 0;}
.listTypeCol1[class*=swiper-box] .listWrap .swiper-slide {margin-left: 0;}
.listTypeCol1[class*=swiper-box] .listBox > li{margin-bottom: 0;}
/*.listTypeCol1[class*=swiper-box] .listWrap .swiper-slide a {margin: 0 5px;}*/
.listTypeCol1 .listWrap{position: relative; width: 1280px;}


[class*=swiper-box] .button-next,
[class*=swiper-box] .button-prev {position: absolute; top: 50%; width: 13px; height: 24px; margin-top: 0px; background: url('../images/content/btn_swiper_arrow.png') no-repeat center center; cursor: pointer;}
[class*=swiper-box] .button-next {right: -28px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
[class*=swiper-box] .button-prev {left: -28px;}

.swiper-button-disabled{opacity: 0.2;}

.mainSection {position: relative;}
.mainSection .btnSortable {display: block; position: absolute; right: 0; top: 28px; width: 20px; height: 20px; text-indent: -9999px; background: url('../images/content/btn_sortable.png') no-repeat center center; overflow: hidden; cursor: pointer;}

/* main layer */
.layerWelcome {margin-right: -720px; position: absolute; right: 50%; bottom: 75px; border-radius: 5px; border: 1px solid #ebebeb; box-shadow: 2px 2px 29px rgba(0,0,0,.22); background: #fff; z-index: 10;}
.layerWelcome .heading {position: relative; padding: 0 23px; color: #f57220; font-size: 16px; font-weight: 700; line-height: 47px; background: #faf1f0 url('../images/content/bg_icon_smile.png') no-repeat right 15px center;}
.layerWelcome .heading:after {content: ''; display: block; position: absolute; right: 25px; bottom: -4px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); border-bottom: 8px solid #faf1f0; border-left: 9px solid transparent; border-right: 9px solid transparent;}
.layerWelcome .midCont {padding: 20px;}
.layerWelcome .midCont .txt {padding-bottom: 27px; line-height: 1.5;}
.layerWelcome .bttm {width: 100%; overflow: hidden;}
.layerWelcome .bttm button {width: 50%; height: 30px; color: #bcc1c6; text-align: center; float: left;}
.layerWelcome .bttm button ~ button {border-left: 1px solid #e4e6e8;}

 


 /* ==============================
 * content
 * ============================== */

 /* 관심주제 설정 */
.interestWrap .chkListWrap {display: table; position: relative; width: 100%;}
.interestWrap .chkListWrap dt {display: table-cell; width: 190px; vertical-align: top;}
.interestWrap .chkListWrap > dd {display: table-cell; vertical-align: middle;}
.interestWrap .chkListWrap > dd ul {margin: 0 -5px; overflow: hidden;}
.interestWrap .chkListWrap li.list {float: left; width: 220px; position: relative;}
.interestWrap .chkListWrap li.list > a {display: table; position: relative; width: 210px; height: 129px; margin: 0 5px; position: relative;}
.interestWrap .chkListWrap li.list > a:hover {text-decoration: none;}
.interestWrap .chkListWrap li.list > a > .bgImg {position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; z-index: 2;}
.interestWrap .chkListWrap li.list > a > .txt {display: table-cell; position: relative; width: 100%; color: #fff; font-size: 20px; text-align: center; vertical-align: middle; transition: all .3s ease; background: rgba(0,0,0,0.4); z-index: 3;}
.interestWrap .chkListWrap ~ .chkListWrap {margin-top: 22px; padding-top: 22px; border-top: 1px solid #e8d2c6;}

.interestWrap .chkListWrap li.list.active a:before {content: ''; display: block; position: absolute; right: 17px; top: 11px; width: 16px; height: 16px; border: 1px solid #fff; box-sizing: border-box; border-radius: 2px; background: #fff; z-index: 5;}
.interestWrap .chkListWrap li.list.active a:after {content: ''; display: block; position: absolute; right: 17px; top: 11px; width: 16px; height: 16px; background: url('../images/common/form_img.png') no-repeat -14px 0; z-index: 5;}
.interestWrap .chkListWrap li.list.active .txt {background: rgba(238,137,70,.6);}

/* 나의알림 리스트 */
.alarmListWrap {position: relative; background: #fff;}
.alarmListWrap > .listBox{border: 1px solid #ddd;}
.alarmListWrap > .listBox > li {position: relative; min-height: 80px; padding: 0 180px 0 92px;}
.alarmListWrap > .listBox > li ~ li{border-top: 1px solid #ddd;}

.alarmListWrap .photoM {display: block; position: absolute; left: 25px; top: 50%; width: 48px; height: 48px; margin-top: -24px; overflow: hidden; z-index: 1;}
.alarmListWrap .photo img {display: block; max-width: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}

.alarmListWrap .message {display: table; width: 100%; table-layout: fixed;}
.alarmListWrap .message .conTxt {display: table-cell; width: 100%; height: 80px; vertical-align: middle; font-size: 15px;}
.alarmListWrap .message .ellipsis {display: block; max-width: 100%; vertical-align: middle;}

.alarmListWrap .posR {display: inline-block; margin-right: 35px; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 2;}
.alarmListWrap .posR .date {display: inline-block; color: #c8c8c8; font-size: 13px; vertical-align: middle;}
.alarmListWrap .posR .btnDel {display: none; margin-left: 20px; color: #b3b3b3; font-size: 15px; vertical-align: middle;}
.alarmListWrap .posR .btnDel:before{content: ''; width: 1px; height: 15px; display: inline-block; vertical-align: middle; margin-right: 20px; background: #bebebe;}

.alarmListWrap > .listBox > li:hover{padding: 0 240px 0 92px;}
.alarmListWrap > .listBox > li:hover .posR {margin-right: 27px;}
.alarmListWrap > .listBox > li:hover .posR .btnDel {display: inline-block;}

.alarmListWrap > .listBox > li.disabled{ background: rgba(0,0,0,.05); opacity: 1;}
/*.alarmListWrap > .listBox > li.disabled:after {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,.05); z-index: 1;}*/
.alarmListWrap > .listBox > li.disabled .conTxt * {color: #c8c8c8;}
.alarmListWrap li.disabled .photoM {border: 1px solid #b8b8b8; box-shadow: none; opacity: 0.4;}
.alarmListWrap li.disabled .posR .date {color: #c8c8c8;}
.alarmListWrap > .listBox > li.disabled:hover .posR {margin-right: 40px;}


/* 마이페이지 메인 */
.myPageListWrap .row {margin: -55px -6px 0 -6px; font-size: 0; line-height: 0;}
.myPageListWrap .row > li {display: inline-table; width: 311px; margin: 55px 6px 0; padding: 23px 14px 18px; font-size: 15px; line-height: 1; background: #fff; box-shadow: 1px 1px 9px rgba(0,0,0,0.1); table-layout: fixed; float: none;}
.myPageListWrap .row > li .titleContXs {margin-bottom: 23px;}
.myPageListWrap .row > li .titleContXs a {display: block; position: relative; line-height: 1; color: #333; font-weight: 700;}
.myPageListWrap .row > li .titleContXs a:after {content: ''; position: absolute; right: 14px; top: 50%; width: 8px; height: 11px; margin-top: -6px; background: url('../images/common/ir_icon.png') no-repeat -36px -70px;}
.myPageListWrap .row > li .thumb {display: block; width: 280px; height: 157px; overflow: hidden;}
.myPageListWrap .row > li .thumb img {width: 100%;}
.myPageListWrap .row > li .listTit {font-size: 16px; color: #333; line-height: 1.1;}
.myPageListWrap .row > li ul li ~ li {margin-top: 20px;}
.myPageListWrap .row .titOnly {padding: 0;}
.myPageListWrap .row > li.titOnly .titleContXs {margin-bottom: 0;}
.myPageListWrap .row > li.titOnly .titleContXs a {padding: 31px 14px 32px;}

.myPageListWrap .community ul a {text-decoration: none;}
.myPageListWrap .community .cate {display: block; margin: 15px 0 10px; line-height: 1.1;}
.myPageListWrap .community .cate em {display: inline-block; margin-left: 2px; vertical-align: top;}
.myPageListWrap .community a:hover .listTit {text-decoration: underline;}

.myPageListWrap .mycontent .videoThumb {position: relative;}
.myPageListWrap .mycontent .videoThumb a {display: block; position: relative;}
.myPageListWrap .mycontent .videoThumb a:after {content: ''; display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,0.8); z-index: 1;}
.myPageListWrap .mycontent .thumb {display: block; position: relative;}
.myPageListWrap .mycontent .thumb:before {content: ''; display: block; position: absolute; left: 50%; top: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%; background: #fff; z-index: 2;}
.myPageListWrap .mycontent .thumb:after {content: ''; display: block; position: absolute; left: 50%; top: 50%; margin: -7px 0 0 -4px; border-left: 8px solid #ff7e00; border-top: 7px solid transparent;  border-bottom: 7px solid transparent; z-index: 3;}
.myPageListWrap .mycontent .barWrap {position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #9c9c9c; z-index: 10;}
.myPageListWrap .mycontent .barWrap .bar {position: absolute; left: 0; height: 4px; background: #f57220; text-align: right;}
.myPageListWrap .mycontent .barWrap .bar:after {content: ''; display: block; width: 1px; height: 12px; position: absolute; right: 0; bottom: 0; background: #f57220;}
.myPageListWrap .mycontent .barWrap .bar span {display: block; position: absolute; right: 0; top: -14px; padding-right: 5px; color: #fc955a; font-size: 11px;}
.myPageListWrap .mycontent .listTit {margin-top: 22px;}
.myPageListWrap .mycontent .date {display: block; margin-top: 8px; color: #b9b9b9; font-size: 13px; line-height: 1.1;}

.myPageListWrap .hstamp > ul li {position: relative; margin-right: -14px; margin-top: 0 !important; padding-left: 64px;}
.myPageListWrap .hstamp > ul li:after {content: ''; display: block; position: absolute; left: 0; top: 50%; width: 49px; height: 35px; margin-top: -18px; background: url('../images/content/ico_mypage_hstamp.png') no-repeat;}
.myPageListWrap .hstamp > ul li:first-child:after {background-position: 0 0;}
.myPageListWrap .hstamp > ul li:last-child:after {background-position: 0 -66px;}
.myPageListWrap .hstamp li p {padding: 11px 42px 11px 0; line-height: 1.4;}
.myPageListWrap .hstamp li:first-child p {padding-top: 5px;}
.myPageListWrap .hstamp li:last-child p {padding-bottom: 0;}
.myPageListWrap .hstamp li ~ li > p {border-top: 1px solid #ddd;}

.myPageListWrap .playlist .listTit {display: block; margin: 16px 0 15px;}
.myPageListWrap .playlist .util .txtSm {display: inline-block; position: relative; line-height: 1.1;}
.myPageListWrap .playlist .util .txtSm ~ .txtSm {margin-left: 4px; padding-left: 8px;}
.myPageListWrap .playlist .util .txtSm ~ .txtSm:after {content: ''; display: block; position: absolute; left: 0; top: 0; width: 1px; height: 13px; background: #bababa;}
.myPageListWrap .playlist .infoRecomm {position: relative; min-height: 34px; margin-top: 15px; padding-left: 44px;}
.myPageListWrap .playlist .infoRecomm .photo {position: absolute; left: 3px; top: 0; width: 34px; height: 34px; border: 2px solid #ffab59; border-radius: 100%; overflow: hidden;}
.myPageListWrap .playlist .photo img {width: 100%;}
.myPageListWrap .playlist .infoRecomm dt {padding: 4px 0 4px; font-size: 12px; color: #b9b9b9;}
.myPageListWrap .playlist .infoRecomm .name {font-size: 12px; color: #666;}

.thumbSelectWrap{position: relative; width: 100%; border: 1px solid #d4d4d4; padding:20px 55px; background: #f8f8f8;}
.thumbSelect{position: relative;}
.thumbSelect > ul > li {width: 120px; height: auto; float: left; border: 1px solid #e6e6e6; cursor: pointer;}
.thumbSelect > ul > li img{width: 100%; height: auto;}
.thumbSelect > ul > li.active:after{content: ''; width: 100%; height: 100%; display: block; position: absolute; background: rgba(252,149,90,0.60); top: 0; border: 2px solid #fc955a; box-sizing: border-box;}

.thumbSelectWrap .button-next,
.thumbSelectWrap .button-prev {position: absolute; top: 50%; width: 13px; height: 24px; margin-top: -12px; background: url('../images/content/btn_swiper_arrow.png') no-repeat center center; cursor: pointer;}
.thumbSelectWrap .button-next {right: 25px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
.thumbSelectWrap .button-prev {left: 25px;}

/* 파일추가방식 */
.selectThumb{font-size: 0px;}
.selectThumb button ~  button{margin-left: 10px;}


.topSide{position: absolute; right: 0; top: 0;}
.topSide > button{height: 40px;}
.topSide .posL{position: absolute; left: 0; top: 0; margin: 0;}
.topSide .SumoSelect{float: left; margin-right: 20px; min-width: 150px;}

.irOnly + .topSide{top:-53px;}
.irOnly + .topSide + [class*=listTypeCol]{margin-top: 53px;}

.topLeft{text-align: left; margin-bottom: 20px;}


.qnaWrap .profile{position: relative; width: 100%; overflow: hidden; margin-bottom: 25px;}
.qnaWrap .profile .info{float: left;}
.qnaWrap .profile .actNum{float: right; margin-right: 85px; font-size: 13px; color: #b9b9b9;}
.qnaWrap .profile .actNum .view .icoIr{width: 21px; height: 13px;}
.qnaWrap .profile .actNum .view .icoIr:before{width: 21px; height: 13px; background-position:-90px -386px; top: 0px;}
.qnaWrap .profile .actNum .date:before,.qnaWrap .profile .actNum .del:before{content: ''; width: 1px; height: 15px; background: #ededed; display: inline-block; margin-right: 25px; vertical-align: middle;}
.qnaWrap .profile .actNum .del{margin-left: 10px;}
.qnaWrap .profile .actNum .del:before{margin-right: 10px;}
.qnaWrap .profile .info *,.qnaWrap .replyProfile *{display: inline-block; vertical-align: middle;}

.qnaWrap .profile .photo,.qnaWrap .replyProfile .photo{position: relative; width: 38px; height: 38px; border-radius: 100%; border: 2px solid #fc955a; overflow: hidden; z-index: 1;  background: url(../images/common/ico_photo_s.png) #fff no-repeat center center;}
.qnaWrap .profile .photo img,.qnaWrap .replyProfile .photo img{display: block; max-width: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.qnaWrap .profile .name,.qnaWrap .replyProfile .name{font-size: 15px; color: #000; margin-left: 15px;}
.qnaWrap .profile .company,.qnaWrap .replyProfile .date{font-size: 13px; color: #9ca1af; margin-left: 5px;}

.qnaWrap .listTit{margin-bottom: 25px; /*padding-right: 110px;*/ max-width: 1110px;  text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.qnaWrap .listSubTxt{text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 100%; /*min-height: 20px;*/ height: 20px;}
.qnaWrap .acoWrap.on .listSubTxt{white-space: normal; height: auto; /*min-height: 27px;*/}
.qnaWrap .answerTxt{padding: 0 0 0 75px; position: relative; clear: both;}
.qnaWrap .answerTxt:before{content: 'A'; display: block; width: 44px; height: 44px; line-height: 44px; color: #fff; background: #59a9b4; border-radius: 2px; text-align: center; position: absolute; top: 0; left: 0;}
.qnaWrap .replyProfile{margin:30px 0 0 75px; float: left;}

.qnaWrap .btnAnswer{position: absolute; top: 117px; right: 32px; }
.qnaWrap .btnAnswer button{min-width: 100px; height: 36px;}

.qnaWrap .listBox a:after{top: 32px;}
.qnaWrap.listTypeCol3 .listBox .acoWrap:after,.qnaWrap.listTypeCol3 .listBox .acoWrap .acoArrow{top:33px;}
.qnaWrap .listTxt{border: none; margin: 0; padding: 0;}
.qnaWrap .answerWrap{font-size: 15px; color: #666; border-top: 1px solid #e6e6e6; margin-top: 25px; padding-top: 25px; position: relative; overflow: hidden;}
.qnaWrap .answerWrap .editUtil{float: left; margin: 37px 0 0 30px;}
.qnaWrap .secret:before{content: ''; display: inline-block; background: url(../images/common/ir_icon.png) -485px -61px no-repeat; width: 11px; height: 14px; margin-right: 10px; position: relative; top: 1px;}

/* 질문하기 */
.qnaQue table.bdForm td.fileBox dt{width: 140px;}
.qnaQue table.bdForm td.fileBox .fileCustom{width:calc(100% - 140px)}

/* 답변하기 */
.qnaAnswer .listTypeCol3 .listBox .acoWrap:after,.qnaAnswer .listTypeCol3 .listBox .acoWrap .acoArrow{display: none;}
.qnaAnswer .qnaWrap .profile .actNum{margin-right:0px;}
.qnaAnswer .listTypeCol3 .listBox > li{z-index: 2;}
.qnaAnswer .qnaWrap .listSubTxt{white-space: normal; height: auto;}
.qnaAnswer .answerBox{width: 1220px; margin: 0 auto; z-index: 1;}
.qnaAnswer .answerBox .conBox{padding: 30px;}



#contents.hStoryMain{position: relative;}
.hStoryMain .topSide{top: -65px;}
.hStoryMain .secCont .secCont{margin-top: 60px;}

.broadcastBtn{position: absolute; bottom: 24px; right: 63px;}
.broadcastBtn button{padding-top: 50px; height: 70px; display: inline-block;color: #59a9b4; font-size: 14px; background: url(../images/common/ir_icon.png) -358px -143px no-repeat;}

.viewFrame{width: 100%; position: relative; margin-bottom: 25px;}
.viewFrame .inner{height: 100%; overflow: hidden;}
.viewFrame .inner.full{min-height: 720px; box-shadow:0px 0px 5px rgba(0,0,0,0.2);}
.viewFrame .inner.full iframe{width: 100%; min-height: 720px; display: block;}
.viewFrame .inner.full iframe img {max-width:100%;}

/*동영상 풀사이즈 */
.viewFrame.movie .inner.full{width: 940px; min-height: 529px; box-shadow:0px 0px 5px rgba(0,0,0,0.2);}
.viewFrame.movie .inner.full iframe{width: 100%; min-height: 529px; display: block;}
.viewFrame.movie .goListWrap{width: 940px;}

.viewFrame .inner.plural{min-height: 504px; box-shadow:0px 0px 5px rgba(0,0,0,0.2); background: #fff;}

.scriptWrap{background: #262628; display: block; overflow: hidden; padding:0 30px 20px 30px; }
.scriptWrap .top{overflow: hidden; padding: 20px 0 0 0;}
.scriptWrap .top .fl{float: left;}
.scriptWrap .top .fr{float: right;}
.scriptWrap .txtArea{clear: both; line-height: 28px; font-size: 15px; color: #b9b9b9; max-height: 140px; overflow-y: auto; padding:0 20px 0 0; margin-top: 20px; display: none;}

.viewFrame .frameListWrap{position:relative; width: 340px; height: auto; float: left; background: #fff; overflow: hidden; }
.viewFrame .frameListWrap .hBox {position:relative;}
.viewFrame .frameListWrap h3{font-size: 16px; color: #333; margin-bottom: 20px; display: block; padding: 25px 50px 0 20px; position: relative;}
.viewFrame .frameListWrap .cnt {position:absolute; right:20px; bottom:2px; font-size: 13px; color: #b9b9b9; }
.viewFrame .frameListWrap .cnt:before{content: ''; width: 11px; height: 13px; display: inline-block; vertical-align: middle; background: url(../images/common/ir_icon.png) -141px -52px no-repeat; margin: -2px 5px 0 15px;}
.viewFrame .frameListWrap .listWrap{overflow-y: auto; height: calc(100% - 69px);}
.viewFrame .frameListWrap .listWrap > ul{padding: 0 20px;}
.viewFrame .frameListWrap .listWrap > ul li{padding: 15px; border-bottom: 1px solid #e2e2e2; position: relative; color: #8e8e8e; overflow: hidden;}
.viewFrame .frameListWrap .listWrap > ul li.noTime a{width: 195px;}
.viewFrame .frameListWrap .listWrap > ul li span{font-size: 12px; color: #b9b9b9; vertical-align: middle; display: inline-block; /*position: absolute; top: 16px; right: 15px;*/ margin-right: 5px;}
.viewFrame .frameListWrap .listWrap > ul li span:before{content: '▶'; font-size: 10px; vertical-align: middle; display: inline-block; margin: -2px 10px 0 0;}
.viewFrame .frameListWrap .listWrap > ul li a{width: 140px; display: inline-block; vertical-align: middle;}
.viewFrame .frameListWrap .listWrap > ul li button{float: right;}

/*.viewFrame .frameListWrap .listWrap > ul li:before{content: ''; width: 17px; height: 17px; display: inline-block; vertical-align: middle; border: 1px solid #e6e6e6; border-radius: 50%; margin: 0 12px 0 5px;}
.viewFrame .frameListWrap .listWrap > ul li.active:after{content: ''; width: 14px; height: 10px; background: url(../images/common/ir_icon.png) -224px -28px no-repeat; position: absolute; left: 10px; top: 20px;}
.viewFrame .frameListWrap .listWrap > ul li.active:before{border-color: #fc975d;}
*/

.viewFrame .frameListWrap .btnAnswer{border-top: 1px solid #e6e6e6; padding: 20px; border-bottom: 1px solid #e6e6e6; background: #f9f9f9; margin-top:25px;}
.viewFrame .inner.plural .frameConWrap{width: calc(100% - 340px); min-height: 529px; float: left;}
.viewFrame .inner.plural iframe{display: block; min-height: 529px; width: 100%;}

.viewSliderBox .swiper-slide{opacity:0.5;}
.viewSliderBox .swiper-slide.swiper-slide-active{/*box-shadow : rgba(0,0,0,0.7) 0 0 0 9999px;*/ opacity:1;}
.viewFrame .viewWrap .full .imgBox{width: 1280px; height: 720px; overflow: hidden;}
.viewFrame .viewWrap .full .viewSliderBox{overflow:hidden; width: 1280px; height: 720px; position: relative;}
.viewFrame .viewWrap .full .viewSlider{width: 1280px; height: 720px; overflow: hidden; background: #000; text-align: center;}
.viewFrame .viewWrap .plural .imgBox{width: 896px; height: 504px; overflow: hidden;}
.viewFrame .viewWrap .plural .viewSliderBox{overflow:hidden; width: 896px; height: 504px; position: relative;}
.viewFrame .viewWrap .plural .viewSlider{width: 896px; height: 504px; overflow: hidden;}
.viewFrame .viewWrap .imgBox img{max-width: 100%; max-height: 100%; transform: translateY(-50%); position: relative; top: 50%;/* opacity: 0.5; */}
.viewWrap .button-prev,.viewWrap .button-next {position: absolute; top: 50%; width: 24px; height: 50px; margin-top: -25px; background: url('../images/common/ir_icon.png') no-repeat -181px -194px; cursor: pointer; z-index: 1}
.viewWrap .button-next {right: 28px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
.viewWrap .button-prev {left: 28px;}
.viewWrap .pagination{right: inherit; left: 50%; transform: translateX(-50%); z-index: 1; bottom: 15px;}

/*.viewFrame .viewWrap .imgBox img {width:100%; height:100%;}*/
.viewFrame .frameListWrap .btnAnswer li ~ li{margin-top: 20px;}
.goListWrap{width: 1280px; margin: 10px auto; text-align: right;}

.blogWrap .inner{width: 750px; height: 100%; padding: 35px 0; position: relative; /*box-shadow:0px 0px 10px rgba(0,0,0,0.2); background: #fff;*/ color: #333;}
.blogWrap .goListWrap{width: 750px;}
.blogWrap h1{font-size: 22px; color:#262626; margin-bottom: 30px;}
.blogWrap p{line-height: 30px;}
.blogWrap p img {max-width:100%;}
.blogWrap strong{font-weight: bold;}

.linkView .inner{width: 750px; padding: 0px 0 0 0; position: relative;}
.linkView .goListWrap{width: 750px;}
.linkList{text-align: center;}
.linkList > li{margin-bottom: 20px; text-align: center;}
.linkList > li a{display: inline-block;}
/*.linkList .thumb img{border: 1px solid #dfdfdf;}*/
/*.linkList .thumb img{max-width: 100%; max-height: 100%; height: 100%; width: auto;}*/
.linkList .txt{font-size: 16px; color: #2f2f2f; line-height: 30px; text-align: left;}
.linkList:after{content: ''; display: block; clear: both;}
.linkView h1{font-size: 22px; color:#262626; margin-bottom: 30px;}
.linkView p img {max-width:100%;}
.linkView strong{font-weight: bold;}


.viewFrame .viewWrap .btnArea{position: absolute; top: 15px; right: 15px; width:auto; text-align: right; z-index: 2;}
.viewFrame .viewWrap .btnIcon{background: rgba(0,0,0,0.70);}

.viewCommon .secCont{background: #fff; box-shadow:0px 0px 10px rgba(0,0,0,0.2); overflow: hidden;}
.viewCommon .leftWarp{border-right: 1px solid #e6e6e6; width: 980px; float: left; position: relative;}
.viewCommon .secCont.full .leftWarp{width: 100%; border-right: none;}
.viewCommon .leftWarp .titArea{border-bottom: 1px solid #e6e6e6; display: block; overflow: hidden; min-height: 71px;padding: 15px 15px 15px 25px;}
.viewCommon .leftWarp .titArea h3{padding: 25px 30px; float: left; color: #000; font-weight: bold; width: calc(100% - 260px);}

.viewCommon .leftWarp .titArea .topLeft{float: left; padding: 10px 0 0 0; margin: 0;}
.viewCommon .leftWarp .titArea .topLeft .actNum{display: inline-block; vertical-align: middle;}
.viewCommon .leftWarp .titArea .topLeft .lastDate{display: inline-block; vertical-align: middle; border-left: 1px solid #e6e6e6; padding-left: 24px; margin-left: 30px; color: #b9b9b9; font-size: 13px; height: 24px; line-height: 24px;}

.viewCommon .leftWarp .titArea .topSide{float: right; position: relative;}


.viewCommon .leftWarp .titArea .topSide .btnBasic{display: inline-block; margin-left: 30px;}

/*.viewCommon .leftWarp .titArea .topSide{position: relative; display: block; width: 260px; float: right; text-align: right; padding: 23px 20px 0 0;}
.viewCommon .leftWarp .titArea.download h3{width: calc(100% - 500px);}
.viewCommon .leftWarp .titArea.download .topSide{width: 500px; padding: 20px 20px 0 0;}*/

.viewCommon .conBox h3:before{content: ''; display: inline-block; background: url(../images/common/ico_view_page.png) no-repeat; vertical-align: middle; margin: -3px 15px 0 0;}

/* 댓글 타이틀 */
.replyTitle{font-size: 18px; color: #000; margin-bottom: 25px;}
.replyTitle:before{content: ''; display: inline-block; background: url(../images/common/ico_view_page.png) no-repeat -5px -44px; vertical-align: middle; margin: -3px 15px 0 0; width: 16px; height: 18px;}

.viewCommon .conBox.research h3:before{ background-position: -5px -0px; width: 16px; height: 17px; }
.viewCommon .leftWarp .contents .conBox.movie h3:before{ background-position: -5px -22px; width: 16px; height: 17px; }
.viewCommon .leftWarp .contents .conBox.more h3:before{ background-position: -5px -44px; width: 16px; height: 18px; }
.viewCommon .leftWarp .contents .conBox.people h3:before{ background-position: -5px -67px; width: 16px; height: 18px; }
.viewCommon .leftWarp .contents .conBox.info h3:before{ background-position: -5px -90px; width: 14px; height: 18px; }
.viewCommon .leftWarp .contents .conBox.file h3:before{ background-position: -5px -113px; width: 16px; height: 18px; }

.viewCommon .contents{padding: 30px;}
.viewCommon .contents .conBox ~ .conBox{margin-top: 60px;}
.viewCommon .contents .conBox .list > li{display: inline-block; vertical-align: top; margin-bottom: 10px;}
.viewCommon .contents .conBox .list:after {content: ''; display: block; clear: both;}

.viewCommon .conBox h3{font-size: 18px; color: #000; padding-left: 0px; margin-bottom: 25px;}
.viewCommon .leftWarp .contents .conBox.info p{font-size: 15px; line-height: 28px; margin-bottom: 20px;}
.viewCommon .leftWarp .contents .conBox.info p img {max-width:100%;}
.viewCommon .leftWarp .contents .conBox.info .tag{display: inline-block; vertical-align: middle; max-width: 890px;}
.viewCommon .leftWarp .contents .conBox.info .tag li{font-size: 13px; color: #59a9b4; margin-left: 15px; margin-bottom: 0;}

.viewCommon .leftWarp .contents .conBox.file li ~ li{margin-top: 5px;}

.tagBox{position: relative; padding-left: 30px; margin-top: 10px;}
.tagIco {position: relative; background: #cdcdcd; width: 10px; height: 10px; display: inline-block; vertical-align: top; margin:7px 0 0 -23px;}
.tagIco:after {right: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(136, 183, 213, 0); border-right-color: #cdcdcd; border-width: 5px; margin-top: -5px;}

.viewCommon .leftWarp .contents .conBox.people .list li{width: 111px;}
.viewCommon .leftWarp .contents .conBox.people .list li ~ li{margin-left: 10px;}
.viewCommon .leftWarp .contents .conBox.people .list li:nth-child(8n){margin-left: 0px;}
.viewCommon .leftWarp .contents .conBox.people [class*=photo]{margin: 0 auto;}
.viewCommon .leftWarp .contents .conBox.people .cont{text-align: center; margin-top: 10px;}
.viewCommon .leftWarp .contents .conBox.people .name{display: block; color: #000;}
.viewCommon .leftWarp .contents .conBox.people .company{display: block; color: #8f929b;}

.viewCommon .conBox.movie .sum{border: 1px solid #dfdfdf; width: 250px; height: 185px; margin-bottom: 10px; position: relative; cursor: pointer;}
.viewCommon .conBox.movie .sum img{width: 100%; height: 100%;}
.viewCommon .conBox.movie .sum2{border: 1px solid #dfdfdf; width: 250px; height: 185px; margin-bottom: 10px; position: relative; cursor: pointer;}
.viewCommon .conBox.movie .sum2 img{width: 100%; height: 100%;}
.viewCommon .conBox.movie strong{font-size: 16px; color: #2f2f2f; margin-bottom: 5px; display: block; width: 100%;}
.viewCommon .conBox.movie p{font-size: 13px; color: #aaa;}

.viewCommon .leftWarp .contents .sum:before,.videoThumb:before{content: ''; width: 48px; height: 48px; border: 3px solid #fff; background: rgba(0,0,0,0.50); display: block; border-radius: 50%; position: absolute; top: 50%; left: 50%; margin: -24px 0 0 -24px; box-sizing: border-box;}
.contents .moreContents:before {width : 0px !important}
.viewCommon .leftWarp .contents .conBox.movie .sum:after,.videoThumb:after{content: ''; width: 8px; height: 11px; background: url(../images/common/ir_icon.png) 0 -134px; position: absolute; top: 50%; left: 50%; margin: -5px 0 0 -2px;}
.viewCommon .leftWarp .contents .conBox.movie .list li{width: 250px; margin-bottom: 10px;}
.viewCommon .leftWarp .contents .conBox.movie .list li ~ li{margin-left: 20px;}
.viewCommon .leftWarp .contents .conBox.movie .list li:nth-child(3n+1){margin-left: 0px;}

.viewCommon .conBox.research .reBox{border: 1px solid #d5d5d5;}
.viewCommon .conBox.research .reBox .list{padding: 20px; border-bottom: 1px solid #d5d5d5;}
.viewCommon .conBox.research .reBox .list > li{float: none; font-size: 0; display: block; width: 100%; margin: 0;}
.viewCommon .conBox.research .reBox .list > li ~ li{margin-top: 30px;}
.viewCommon .conBox.research .reBox .list strong{width: 55px; display: inline-block; font-size: 20px; color: #59a9b4; vertical-align: top;}
.viewCommon .conBox.research .reBox .list .tit{font-size: 16px; color: #262626; display:inline-block; width: calc(100% - 55px);}
.viewCommon .conBox.research .reBox .reList,.viewCommon .conBox.research .reBox .msg{margin-top: 15px; padding-left: 55px;}
.viewCommon .conBox.research .reBox .reList li ~ li{margin-top: 10px;}
/*.viewCommon .conBox.research .reBox .reList textarea {padding-left:20px;}*/

.viewCommon .conBox.research .btnArea{padding: 30px 0;}
.viewCommon .leftWarp > .btnArea{background: #f6f6f6; padding: 30px 0; border-top: 1px solid #ddd;}

.viewCommon .boxHeight .contents{padding: 30px 30px 146px 30px; min-height: 300px;}
.viewCommon .boxHeight .leftWarp > .btnArea{position: absolute; bottom: -60px;}


.viewCommon .rightWrap{float: right; width: 301px; border-left: 1px solid #e6e6e6; margin-left: -1px; padding: 30px 0; position: relative;}
.viewCommon .rightWrap .topSide{top:30px; right: 25px;}
.viewCommon .rightWrap .topSide > span{font-size: 13px; color: #aaa; display: inline-block; vertical-align: middle; margin-right: 10px;}
.viewCommon .rightWrap .topSide > label{display: inline-block; vertical-align: middle;}
.viewCommon .rightWrap h3{font-size: 18px; color: #000; padding-left: 25px; margin-bottom: 20px;}
.viewCommon .rightWrap > p{font-size: 13px; color: #cdcdcd; padding-left: 25px; margin-bottom: 20px;}
.viewCommon .rightWrap .conBox{width: 250px; margin: 0 auto;}
.viewCommon .rightWrap .conBox.movie li ~ li{margin-top: 25px;}


.connectTab{z-index: 2; position: relative; margin: 0 auto; width: 100%;; background: #f9f9f9; padding: 40px 0;}
.connectTab .listTypeCol1{margin: 0 auto; height: 120px;}
.connectTab .listTypeCol1 > a{margin-top: -12px;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a{height: 120px; border: 1px solid #e6e6e6;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a:hover:after{content: ''; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; z-index: 2; background: rgba(0,0,0,0.3);}
.connectTab .listTypeCol1 .listWrap .listBox > li > a.on:after{content: ''; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: rgba(89,169,180,0.78) !important; opacity: 1;}
/*.connectTab .listTypeCol1 .listWrap .listBox > li > a:hover:before{content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(89,169,180,0.70); z-index: 2;}*/
/*.connectTab .listTypeCol1 .listWrap .listBox > li > a.on:hover:after{background: rgba(89,169,180,0.78) !important;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a.on .thumb:after{background: rgba(89,169,180,0.78) !important;}*/

.connectTab .listTypeCol1 .listWrap .listBox > li > a .titTxt{position: absolute; top: 0; left: 0; text-align: center; width: 100%; height: 100%; z-index: 3; line-height: 120px; color: #fff; font-size: 18px;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a.more{background: transparent; border: 1px solid #dfdfdf; padding: 5px; display: table; width: 100%;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a.more span{width: 100%; height: 100%; border:1px dashed #e6e6e6; font-size: 14px; color: #b5b5b5; text-align: center; display: table-cell; vertical-align: middle;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a.more:hover span{text-decoration: underline;}
.connectTab .listTypeCol1 .listWrap .listBox > li > a.more:before,.connectTab .listTypeCol1 .listWrap .listBox > li > a.more:after{display: none;}

.connectTab .listTypeCol2 {position:relative; width:1280px; margin: 0 auto; padding:0 20px;}
.connectTab .listTypeCol2 > a{margin-top: -16px;}
.connectTab .listTypeCol2 .listWrap {overflow:hidden;}
.connectTab .listTypeCol2 .listWrap .listBox > li {float:none; width:auto; margin:0; box-sizing:border-box; height:50px; padding-right:10px;}
.connectTab .listTypeCol2 .listWrap .listBox > li:last-child {padding-right:0;}
.connectTab .listTypeCol2 .listWrap .listBox > li > a {
	background: #fff;
    box-sizing: border-box;
    border: none;
    padding: 0 25px;
    line-height: 42px;
    text-align: center;
    color: black;
    border: 1px solid #eee;
}
.connectTab .listTypeCol2 .listWrap .listBox > li > a:hover,
.connectTab .listTypeCol2 .listWrap .listBox > li.swiper-slide > a.blue.on {background:#ff8d00; color:#fff;}
.connectTab .listTypeCol2 .button-prev {left:0;}
.connectTab .listTypeCol2 .button-next {right:0;}

/* playlist 그래프 */

.playGraph > li{box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.1); background:#fff; float: left; width: calc(50% - 8px); margin-bottom: 20px; position: relative; padding: 30px; min-height: 385px;}
.playGraph > li:nth-child(2n){margin-left: 16px;}
.playGraph h3{font-size: 18px; color: #262626; font-weight: bold; margin-bottom: 30px;}
.playGraph > li .topSide{top:30px; right: 30px;}
.playGraph .chartWrap{width: 100%; height: 100%;}
.playGraph .SumoSelect{min-width: 150px;}


/* 통합검색 */
.searchListWrap > .inner > .secCont{margin-bottom: 50px;}
.searchListWrap > .inner > .secCont > .secCont ~ .secCont{margin-top: 30px;}
.searchListWrap .comTxtWrap{background: #fff; border: 1px solid #e6e6e6; position: relative; max-height: 300px; cursor: pointer;}
.searchListWrap .comTxtWrap .topSide{top:35px; right: 30px;}
.searchListWrap .btnArea{margin-top: 20px;}
.searchListWrap .searchResult > li ~ li{margin-top: 20px;}
.searchListWrap .listTypeCol3 .listBox > li{background: #fff; border: 1px solid #e6e6e6; position: relative; cursor: pointer; box-shadow: none;}
.searchListWrap .listTypeCol3 .listTxt{border-top: none; padding-top: 0; display: block;}
.searchListWrap .qnaWrap .profile .actNum{margin-right: 0px;}
.searchListWrap .noSearchData{width: 100%; height: 100px; border: 1px solid #e6e6e6; background: #fff;}

.searchListWrap .listTypeCol1 .listBox > li{margin-bottom: 0px;}
.searchListWrap .listTypeCol1 .listBox > li:nth-child(n+6){margin-bottom:0px; margin-top: 40px;}

.searchListWrap .listTypeCol3 .listBox .acoWrap:after{display: none;}
.searchListWrap .listTypeCol3 .listBox .acoArrow{display: none;}
.searchListWrap .addNumList .actNum{padding-right: 0px;}



/* 계열사 상품 list */
.product .listWrap .listBox > li > a{height: auto;}
.product .titArea{margin-bottom: 20px;}
.product .infoBox{padding:23px 14px 20px 14px;}
.product .infoBox .listTxt{position: relative; top: 0; left: 0; right: 0; margin-bottom: 4px;}
.product .infoBox .listTxt span{margin:0 0 0 5px;display: inline-block; vertical-align: middle;}
.product .infoBox .listTxt span:before{content: '|'; display:block; display: inline-block; vertical-align: middle; margin:0 5px 0 0;}
.product .infoBox .listTit{font-weight: normal; min-height: 70px; padding-top: 0px;}
.product .info{overflow: hidden; position: relative; margin-bottom: 20px; white-space: nowrap; text-overflow: ellipsis;}
.product .info:after{content: ''; display: block; clear: both;}
.product .info .photoS{float: left; margin-right: 10px;}
.product .info .name{display: block; font-size: 15px; color: #000; max-width: 100px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.product .info .company{display: block; font-size: 13px; color: #8f929b; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; min-height: 20px;}
.product .info .date{position: absolute; right: 0; top: 0; font-size: 12px; color: #b9b9b9;}
.product .actNum{position: relative; left: 0; right: 0;  bottom: inherit;}


/* 컨텐츠 등록 */
.conReg{padding: 40px 0 0 0;}
.conReg .secCont{padding: 0 30px 30px 30px;}
.conReg .titleContMd{padding: 0 30px;}
.conReg > .btnArea{background: #f6f6f6; padding: 30px 0; border-top: 1px solid #ddd;}
.conReg .bdForm .w100,.conReg .bdForm textarea{width: 100%;}
.conReg .chkGroup{margin-bottom: 17px;}
.conReg .chkGroup li{display: inline-block;}
.conReg .chkGroup li ~ li{margin-left: 60px;}
.conReg .chkGroup .whiteLine{cursor: default; height: 36px; min-width: 100px; outline: none;}
.conReg .radioGroup input[type=radio] + label ~ label{margin-left: 70px;}
.conReg .contOpt{display: none;}

.calWrap{height: 36px;}
.calWrap > li{float: left;}
.calWrap > li ~ li{margin-left: 3px;}
.calWrap .SumoSelect{min-width: 80px;}
.calWrap .datepicker{width: 130px;}
.calWrap .btnS{margin-left: 10px;}
.calWrap .btnS button{height: 36px; min-width: 60px;}
.calWrap .dateTxt{width: 60px; height: 36px; line-height: 36px; display: block; text-align: center;}


[class*=inpType]{overflow: hidden; font-size: 0px;}
[class*=inpType] dt{font-size: 13px; color: #262626; width:160px; display: inline-block; vertical-align: middle;}
[class*=inpType] dd{width: calc(100% - 160px); display: inline-block; vertical-align: middle;}
[class*=inpType] ~ [class*=inpType]{margin-top: 15px;}
.inpType2 dt .btnIconS{margin-left: 15px;}
.inpType2.downFile dt{vertical-align: top; padding-top: 6px;}
.inpType2.downFile .btnArea{display: inline;}
.inpType2.downFile .fileCustom .inputFileWrap{width:calc(100% - 25px)}

.downFileFull th *{display: inline-block; vertical-align: middle; margin-top: -2px;}
.downFileFull th .btnArea{width: auto; margin-left: 10px;}
.downFileFull .fileCustom .inputFileWrap{width: calc(100% - 25px);}

.fileCustom{font-size: 0;}
.fileCustom li ~ li{margin-top: 15px;}
.fileCustom .inputFileWrap{width: calc(100% - 34px); vertical-align: middle; display: inline-block;}
.fileCustom .btnIconS{margin-left: 10px; vertical-align: middle; display: inline-block;}

.fileList > li{margin-top: 10px;}

dl.inpType3 {margin: 0 0 6px 0;}
dl.inpType3 dd{float:left;width:calc(100% - 160px);text-align:right;}
dl.inpType3 dt {float:left;width:100px; font-weight: bold;}
dl.inpType3 dt label {font-size: 13px; line-height: 36px; height: 36px; cursor: default;}
dl.inpType3 dd.info {float:left;width:60px; font-size: 11px; vertical-align: middle; color: #9c9c9c; padding: 7px 0 0 0;}

.contentsType .btnArea{text-align: left; margin-bottom: 5px;}


/* 커뮤니티 */
.commuInfo{position: relative;}
.commuInfo .titArea{background: #59a9b4; color: #fff; padding:30px 20px 50px 20px; position: relative;}
.commuInfo .titArea em,.commuInfo .titArea h2{display: block; width: 100%; text-align: center;}
.commuInfo .titArea em{font-size: 14px; color: #e6f3f5; margin-bottom: 10px;}
.commuInfo .titArea h2{font-size: 21px; margin: 30px 0 20px; color: #fff;}
.commuInfo .titArea h2 a{color: #fff; font-weight: bold;}
.commuInfo .titArea p{font-size: 14px; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
.commuInfo .titArea .thumb{position: absolute; left: 50%; bottom: -124px; margin: 0 0 0 -106px; box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.2); width: 212px; height: 159px;}
.commuInfo .titArea .thumb img{width:auto; height:100%; position: relative; left: 50%; transform: translateX(-50%);}
.commuInfo .titArea .util{position: absolute; top: 25px; right:25px;}
.commuInfo .titArea .util button ~ button{margin-left: 20px;}
.commuInfo .titArea + .detail{margin-top: 124px;}
.commuInfo .detail{width: 256px; margin: 0 auto; padding: 30px 0; border-bottom: 1px solid #eaeaea;}
.commuInfo .detail:after{content: ''; display: block; clear: both; }
.commuInfo .detail h3{font-size: 14px; color: #b5b5b5; width: 100%; display: block; text-align: center; font-weight: normal; margin-bottom: 15px;}
.commuInfo .detail .txt{text-align: center;}
.commuInfo .detail .memList{display: inline-block; vertical-align: middle;}
.commuInfo .detail .memList li{float: left;}
.commuInfo .detail .memList .photoM{box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.1);}
.commuInfo .detail .memList li ~ li{margin-left: -20px;}
.commuInfo .detail .more{width: 48px; height: 48px; text-align:center; line-height: 48px; display: inline-block; background: #fc955a; border-radius: 50%; color: #fff; vertical-align: middle; margin-left: 40px; position: relative;}
.commuInfo .detail .more:before{content: '...'; color: #c0c0c0; width: 40px; top: -4px; left: -42px; position: absolute;}

.commuInfo .detail .hasList{text-align: center; margin-bottom: 30px;}
.commuInfo .detail .hasList li{display: inline-block;}
.commuInfo .detail .hasList li ~ li{margin-left: 10px;}
.commuInfo .detail .inpIcoBox,.commuInfo .detail .inpIcoBox input{width: 100%;}
.commuInfo > .btnArea{width: 100%; padding: 15px 30px;}
.commuInfo > .btnArea .btnBasic{width: 100%; margin-left: 0;}
.commuInfo > .btnArea .btnBasic ~ .btnBasic{margin-top: 10px;}

.commuList .listTit{text-align: center; height: 55px; line-height: 55px; cursor: pointer; color: #333;}
.commuList .listTit:after{content: ''; display: inline-block; vertical-align: middle; width: 11px; height: 6px; background: url(../images/common/ir_icon.png) -143px -79px; margin: -3px 0 0 20px;}
.commuList.on .listTit:after{ -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}

.commuList .listTxt{border-top: 1px solid #e6e6e6;}
.commuList li{display: block; padding: 10px 30px; overflow: hidden;}
.commuList li ~ li{border-top: 1px solid #e6e6e6;}
.commuList .thumb{overflow: hidden; width: 48px; height: 48px; border: 1px solid #e6e6e6; float: left;}
.commuList .thumb img{width: 47px; height: 47px;}
.commuList .txtArea{float: left; width: calc(100% - 48px); padding:3px 15px;}
.commuList .txtArea span{display: block; width: 100%;}
.commuList .txtArea .tit{font-size: 15px; color: #333; font-weight: bold;}
.commuList .txtArea .txt{font-size: 13px;}

.commuList2{width: 260px;}
.commuList2 ~ .commuList2{margin-top: 60px !important;}
.commuList2 .titleContSm{margin-bottom: 15px;}
.commuList2 .titleContSm span{color: #2b3c4c; margin-left: 10px;}
.commuList2 .listTxt a{display: block; text-decoration: none;}
.commuList2 .listTxt a:hover .name{text-decoration: underline;}
/*.commuList2 .listTxt a:hover:after{content: ''; width: 17px; height: 21px; display: block; position: absolute; right: 7px; top: 24px; background: url(../images/common/ir_icon.png) -198px -157px;}*/
.commuList2 .listTxt .thumb{width: 50px; height: 50px; display: inline-block; vertical-align: middle; box-shadow:0px 0px 15px rgba(0,0,0,0.5);}
.commuList2 .listTxt .thumb img{width: 100%; height: 100%;}
.commuList2 .listTxt li{border-bottom: 1px solid #e6e6e6; padding: 10px 0; position: relative;}


.commuList2 .listTxt .tit {display: inline-block; vertical-align: middle; margin-left: 15px;}
.commuList2 .listTxt .tit span{display: inline-block; vertical-align: middle;}
.commuList2 .listTxt .tit .name{max-width: 150px;}
.commuList2 .listTxt .tit .num{ color: #fff; padding: 0 5px; height: 15px; line-height: 15px; background: #59a9b4; border-radius: 7px; font-size: 11px; text-align: center; margin:2px 0 0 5px;}


.commuBtn button{text-align: center; width: 100%; height: 55px; color: #333;}


/* 캘린더 */

.monthTit{width: 330px; margin: 0 auto 20px; text-align: center; position: relative;}
.monthTit button{position: absolute; background: url(../images/common/ir_icon.png) -145px -193px no-repeat; font-size: 0; text-indent: -9999px; width: 13px; height: 24px; top: 20px;}
.monthTit em{font-size: 17px;}
.monthTit h3{color: #262626; margin-top: -5px; font-size: 24px;}
.monthTit .btnPre{left: 0;}
.monthTit .btnNext{right: 0; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}

.myCalendarWrap .conDiviWrap .left{width: 370px;}
.myCalendarWrap .conDiviWrap .right{width: calc(100% - 390px);}
.myCalendar > div > ul{width: 100%; font-size: 0px;border:1px solid #e6e6e6;}
.myCalendar > div > ul > li{display:inline-block; width: 127px; font-size: 14px; position: relative; overflow: hidden;}
.myCalendar > div > ul > li:nth-child(7n+1){width: 125px;}
.myCalendar > div > ul.dateNum{margin-top: -1px;}
.myCalendar > div > ul.week > li{height: 40px; line-height: 40px; text-align: center; font-size: 15px; color: #262626; font-weight: bold; background: #f7f7f7;}
.myCalendar > div > ul.dateNum > li{height: 125px; padding: 15px 12px; text-align: right; border-right:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; cursor: pointer;}

.myCalendar > div > ul.broadCastWeek > li{border: 1px solid #e6e6e6;}
.myCalendar > div > ul.broadDateNum > li{border: 1px solid #e6e6e6;}

.myCalendar > div > ul.broadCastWeek{border: none;}
.myCalendar > div > ul.broadDateNum{border: none;}

.myCalendar > div > ul.dateNum > li.active:hover,.myCalendar > div > ul.dateNum > li.active{background: #f2f9f9;}  
.myCalendar > div > ul.dateNum > li.active:hover span,.myCalendar > div > ul.dateNum > li.active span{color: #000; font-weight: bold;}
.myCalendar > div > ul.dateNum > li.holiday span{color: #e60729;}
.myCalendar > div > ul.dateNum > li:nth-child(7n+1) span{color: #e60729;}
.myCalendar > div > ul.dateNum > li:nth-child(7n) span{color: #77cb98;}
.myCalendar > div > ul.dateNum > li:hover{background:#f7f7f7;}
.myCalendar > div > ul.dateNum > li.dim span{color: #b5b5b5 !important;}
.myCalendar > div > ul.dateNum > li.dim:hover{background: #fff;}
.myCalendar > div > ul.dateNum.row5 > li.dim:nth-child(n+36){display: none;}
.myCalendar > div > ul.dateNum.row6 > li.dim:nth-child(n+43){display: none;}

.broadCastCalendar > div > ul > li {width: 254px !important;}
.broadCastCalendar > div > ul.dateNum > li {height : 150px !important; overflow-y: auto};

.myCalendar .util{position: absolute; top: 16px; right: 35px;}
.myCalendar .util li{float: left; margin-left: 8px;}
.myCalendar .util i{font-size: 0;}

/* 이전 리스트
.myCalendar .list{margin-top: 18px;}
.myCalendar .list li{font-size: 13px; text-align: left;}
.myCalendar .list li:before{content: '·'; display: inline-block; margin-right: 5px;}*/

.myCalendar .list{margin-top: 14px;}
.myCalendar .list li{font-size: 12px; text-align: left; width: 100%; background: #8c8c8c; border-radius: 2px; padding: 1px 4px; color: #fff;}
.myCalendar .list li.orange{background: #fc955a;}
.myCalendar .list li.blue{background: #34acbd;}
.myCalendar .list li ~ li{margin-top: 2px;}


/*.myCalendar .more{font-size: 12px; color: #b5b5b5; position: absolute; bottom: 8px; right: 8px;}*/

/* 삭제
.myCalendar.small{width: 252px; margin: 0 auto; padding: 15px 0;}
.myCalendar.small > ul{border: none;}
.myCalendar.small > ul > li{width: 36px; height: auto; border: none; font-size: 14px; padding: 7px; text-align: center;}
.myCalendar.small > ul.week > li{background: #fff; font-weight: normal; font-size: 14px; color: #b5b5b5;}

.myCalendar.small .month{width: 100%; text-align: center; position: relative; margin-bottom: 10px;}
.myCalendar.small .month button{position: absolute; background: url(../images/common/ir_icon.png) -105px -85px no-repeat; font-size: 0; text-indent: -9999px; width: 7px; height: 13px; top: 15px;}
.myCalendar.small .month em{font-size: 12px;}
.myCalendar.small .month h3{color: #262626; margin-top: -5px;}
.myCalendar.small .month .btnPre{left: 0;}
.myCalendar.small .month .btnNext{right: 0; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}

.myCalendar.small .dateNum span{width: 22px; height: 22px; line-height: 22px; display: block; margin: 0 auto; cursor: pointer; border-radius: 50%;}
.myCalendar.small .dateNum span:hover{color: #59a9b2;}
.myCalendar.small .dateNum .today span{background: #59a9b2; color: #fff;}
.myCalendar.small .dateNum .active span{background: #9b9b9b; color: #fff;}

*/

.mycalLeftWrap{padding: 20px;}
.mycalLeftWrap.memo{width: 100%;}
.mycalLeftWrap.memo h3{margin-bottom: 30px; font-weight: normal;}
.mycalLeftWrap.memo textarea,.mycalLeftWrap.memo > button{width: 100%;}
.mycalLeftWrap.memo textarea{margin-bottom: 5px; border: none; padding: 0;}

.myCalLeft{overflow: hidden;}
.myCalLeft .listTit{text-align: left; height: 55px; line-height: 55px; cursor: pointer; color: #333; position: relative; font-size: 18px; padding: 0 20px;}
.myCalLeft .listTit:after{content: ''; display: block; width: 11px; height: 6px; background: url(../images/common/ir_icon.png) -143px -79px; margin: -3px 0 0 20px; position: absolute; right: 20px; top: 26px;}
.myCalLeft.on .listTit:after{ -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
.myCalLeft .listTxt{padding:10px 0 20px;}
.myCalLeft li{display: block; padding: 5px 20px; overflow: hidden;}
.myCalLeft .txtArea em{font-size: 13px; display: block; margin-bottom: 5px;}
.myCalLeft .txtArea span{font-size: 14px; display: block;}

.myCalLeft.orange .listTit, .myCalLeft.orange em{color: #fc955a;}
.myCalLeft.blue .listTit, .myCalLeft.blue em{color: #59a9b4;}



/* 온택트 캘린더 */

.ontactCalendarWrap .conDiviWrap .left{width: 370px;}
.ontactCalendarWrap .conDiviWrap .right{width: calc(100% - 390px);}
.ontactCalendar > div > ul{width: 100%; font-size: 0px;border:1px solid #e6e6e6;}
.ontactCalendar > div > ul > li{display:inline-block; width: 127px; font-size: 14px; position: relative; overflow: hidden;}
.ontactCalendar > div > ul > li:nth-child(7n+1){width: 125px;}
.ontactCalendar > div > ul.dateNum{margin-top: -1px;}
.ontactCalendar > div > ul.week > li{height: 40px; line-height: 40px; text-align: center; font-size: 15px; color: #262626; font-weight: bold; background: #f7f7f7;}
.ontactCalendar > div > ul.dateNum > li{height: 190px; padding: 15px 8px; text-align: right; border-right:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; cursor: pointer;}

.ontactCalendar > div > ul.broadCastWeek > li{border: 1px solid #e6e6e6;}
.ontactCalendar > div > ul.broadDateNum > li{border: 1px solid #e6e6e6;}

.ontactCalendar > div > ul.broadCastWeek{border: none;}
.ontactCalendar > div > ul.broadDateNum{border: none;}

.ontactCalendar > div > ul.dateNum > li.active:hover,.ontactCalendar > div > ul.dateNum > li.active{background: #f2f9f9;}  
.ontactCalendar > div > ul.dateNum > li.active:hover span,.ontactCalendar > div > ul.dateNum > li.active span{color: #000; font-weight: bold;}
.ontactCalendar > div > ul.dateNum > li.holiday span{color: #e60729;}
.ontactCalendar > div > ul.dateNum > li:nth-child(7n+1) span{color: #e60729;}
.ontactCalendar > div > ul.dateNum > li:nth-child(7n) span{color: #77cb98;}
.ontactCalendar > div > ul.dateNum > li:hover{background:#f7f7f7;}
.ontactCalendar > div > ul.dateNum > li.dim span{color: #b5b5b5 !important;}
.ontactCalendar > div > ul.dateNum > li.dim:hover{background: #fff;}
.ontactCalendar > div > ul.dateNum.row5 > li.dim:nth-child(n+36){display: none;}
.ontactCalendar > div > ul.dateNum.row6 > li.dim:nth-child(n+43){display: none;}

.broadCastCalendar > div > ul > li {width: 254px !important;}
.broadCastCalendar > div > ul.dateNum > li {height : 150px !important; overflow-y: auto};

.ontactCalendar .util{position: absolute; top: 16px; right: 35px;}
.ontactCalendar .util li{float: left; margin-left: 8px;}
.ontactCalendar .util i{font-size: 0;}

.ontactCalendar .list{margin-top: 14px;}
.ontactCalendar .list li{font-size: 12px; text-align: left; width: 100%; background: #8c8c8c; border-radius: 2px; padding: 1px 4px; color: #fff;}
.ontactCalendar .list li.orange{background: #fc955a;}
.ontactCalendar .list li.blue{background: #34acbd;}
.ontactCalendar .list li ~ li{margin-top: 2px;}


.ontactCalLeftWrap{padding: 20px;}
.ontactCalLeftWrap.memo{width: 100%;}
.ontactCalLeftWrap.memo h3{margin-bottom: 30px; font-weight: normal;}
.ontactCalLeftWrap.memo textarea,.ontactCalLeftWrap.memo > button{width: 100%;}
.ontactCalLeftWrap.memo textarea{margin-bottom: 5px; border: none; padding: 0;}

.ontactCalLeft{overflow: hidden;}
.ontactCalLeft .listTit{text-align: left; height: 55px; line-height: 55px; cursor: pointer; color: #333; position: relative; font-size: 18px; padding: 0 20px;}
.ontactCalLeft .listTit:after{content: ''; display: block; width: 11px; height: 6px; background: url(../images/common/ir_icon.png) -143px -79px; margin: -3px 0 0 20px; position: absolute; right: 20px; top: 26px;}
.ontactCalLeft.on .listTit:after{ -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
.ontactCalLeft .listTxt{padding:10px 0 20px;}
.ontactCalLeft li{display: block; padding: 5px 20px; overflow: hidden;}
.ontactCalLeft .txtArea em{font-size: 13px; display: block; margin-bottom: 5px;}
.ontactCalLeft .txtArea span{font-size: 14px; display: block;}

.ontactCalLeft.orange .listTit, .ontactCalLeft.orange em{color: #fc955a;}
.ontactCalLeft.blue .listTit, .ontactCalLeft.blue em{color: #59a9b4;}


/* 계열사,마켓 상품 상세 */
.productView .infoWrap{border-bottom: 1px solid #ddd;}
.productView .topSide{top: 30px; right: 30px;}
.productView .topSide .btnBox{position: relative;}
.productView .btnBox .modalPopupWrap {position:absolute; top:60px; width: auto;}
.productView .btnBox .modalPopupWrap .popupContainer {position:absolute; left: -268px; top:0; border:1px solid #e6e6e6; box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.1); background:#fff;}

.productView .titArea{margin-bottom: 20px; text-align: center;}
.productView .titArea > em{font-size: 13px; color: #fc955a;}
.productView .titArea em span:before{content: ''; display:inline-block; margin: 0 10px; background: #fc955a; width: 1px; height: 11px;}
.productView .titArea .titTxt{font-size: 20px; margin-bottom: 15px;}
.productView .txtArea{border: 1px solid #e6e6e6; padding: 20px;margin-bottom: 20px;}
.productView .txtArea img{max-width: 100%;}
.productView .infoBox span{display: inline-block; vertical-align: middle;}

.productView .tagBox{margin-top: 15px; text-align: left;}
.productView .actNum{float: right; margin-top: -35px;}

/* h 포인트 리스트 그래프 */
.hPointList .pointLevel ul{display:table; width: 100%; margin: 10px auto 0; font-size: 0px;}
.hPointList .pointLevel li{display:table-cell; text-align: center; font-size: 13px;}
.hPointList .pointLevel li p{font-size: 22px; color: #59a9b4; margin-bottom: 0px;}
.hPointList .pointLevel li em{font-size: 14px;}


/* 커뮤니티 멤버 리스트 */
.commuMem{padding: 0px; padding: 30px; overflow: hidden; min-height: 500px;}
.commuMem .listWrap{margin: 0;}
.commuMem .listWrap li{width: 50%; float: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.commuMem .listWrap li ~ li{margin: 30px 0 0 0;}
.commuMem .listWrap li:nth-child(1){margin-top: 0px;}
.commuMem .listWrap li:nth-child(2){margin-top: 0px;}
.commuMem .info .name{display: block;}
.commuMem .photoL{width: 84px; height: 84px; background: url(../images/common/ico_photo.png) #fff no-repeat center center;}
.commuMem .photoM{background: url(../images/common/ico_photo_s.png) #fff no-repeat center center;}

/* 퀴즈생성 ox 라디오 */
.oxGroup{padding-left: 70px;}
.oxGroup label:before,.oxGroup label:after{top: 7px !important;}
.oxGroup span{display: inline-block; padding: 7px 16px; background: #fff; border: 1px solid #c5c5c5; border-radius: 2px; font-size: 0; vertical-align: middle; text-align: center; margin-left: 10px;}
.oxGroup span:before{content: ''; display: inline-block; vertical-align: middle; background: url(../images/common/ir_icon.png) no-repeat -402px -103px;width: 12px;height: 12px;}
.oxGroup label:last-of-type span:before{background-position:  -433px -103px;}
.oxGroup .radioGroup label ~ label{margin-left: 40px;}


/* digital 상단 슬라이드 */
.multiSliderWrap{width: 100%; height: 482px; background: #1c1d27;
background: -moz-linear-gradient(top, #1c1d27 0%, #0e0f14 100%);
background: -webkit-linear-gradient(top, #1c1d27 0%,#0e0f14 100%);
background: linear-gradient(to bottom, #1c1d27 0%,#0e0f14 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1d27', endColorstr='#0e0f14',GradientType=0 );
padding: 40px 0; margin-bottom: 50px; position: relative;
}
.multiSliderWrap .gallery-top{position: relative; margin-bottom: 35px;}
.multiSliderWrap .gallery-top .swiper-slide{width: 100%; height: 255px; padding: 0 61px;}
/*.multiSliderWrap .gallery-top .imgArea{width: 292px; height: 219px; float: left; overflow: hidden;}*/
.multiSliderWrap .gallery-top .imgArea{width: 340px; height: 255px; float: left; overflow: hidden;}
.multiSliderWrap .gallery-top .imgArea img, .multiSliderWrap .gallery-thumbs .swiper-slide img{width:auto; height:100%; position: relative; left: 50%; transform: translateX(-50%);}
.multiSliderWrap .gallery-top .contArea{float: left; width:calc(100% - 340px); padding: 10px 30px; height: 255px; position: relative;}
.multiSliderWrap .gallery-top .contArea .tit{font-size: 40px !important; color: #fff !important; display: block; font-weight: normal; margin-bottom: 10px; width: 100%; line-height: 50px !important; max-height: 101px; overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
.multiSliderWrap .gallery-top .contArea .txt{font-size: 16px !important; color: #fff !important; display: block; margin-bottom: 30px; width: 100%; line-height: 24px !important; max-height: 49px; overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
.multiSliderWrap .gallery-top .contArea .tit p{font-size: 36px !important; color: #fff !important; line-height: 44px !important;}
.multiSliderWrap .gallery-top .contArea .txt p{font-size: 15px !important; color: #fff !important; line-height: 24px !important;}
.multiSliderWrap .gallery-top .contArea .actNum{position: absolute; bottom: 15px; left: 30px;}


.multiSliderWrap .gallery-top .button-next,
.multiSliderWrap .gallery-top .button-prev {position: absolute; top: 50%; width: 13px; height: 24px; margin-top: -12px; background: url('../images/content/btn_swiper_arrow.png') no-repeat center center; cursor: pointer; z-index: 3;}
.multiSliderWrap .gallery-top .button-next {right: 25px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
.multiSliderWrap .gallery-top .button-prev {left: 25px;}

.multiSliderWrap .gallery-thumbs{position: relative;}
.multiSliderWrap .gallery-thumbs .swiper-slide{width: 160px; height: 120px; position: relative; overflow: hidden; opacity:0.4;}
.multiSliderWrap .gallery-thumbs .swiper-slide-active{ opacity:1;}


.multiSliderWrap .pagination {position: absolute; bottom: 26px; text-align: center; width: 100%; z-index: 2; right: 0;}
.multiSliderWrap .pagination .swiper-pagination-bullet{background: #fff; width: 7px; height: 7px; opacity: 1;}
.multiSliderWrap .pagination .swiper-pagination-bullet-active{background: #59a9b4;}
.multiSliderWrap .pagination span ~ span{margin-left: 8px;}


/* 소개 */
.introduce #contents{padding: 61px 0 0;}
.introduce #container{background: #ececec;}
.introWrap .inner{width: 750px;}
.introWrap{position: relative;}
.introWrap .introMenu{width: 100%; position: absolute; top: 476px; z-index: 2; transition: background .3s ease,height 3s ease;}
.introWrap .introMenu ul{width: 750px; margin: 0 auto; overflow: hidden;}
.introWrap .introMenu ul li{float: left; width: 250px; border: 1px solid #919191;}
.introWrap .introMenu ul li ~ li{margin-left: -1px; width: 251px;}
.introWrap .introMenu ul li a{width: 100%; height: 70px; line-height: 70px; background: rgba(0,0,0,0.30); color: rgba(255,255,255,0.70); display: block; text-align: center;}
.introWrap .introMenu ul li a:hover,.introWrap .introMenu ul li a.on{color:rgba(245,114,32,0.70); background: rgba(0,0,0,0.90); text-decoration: none;}
.introWrap .introMenu.fixed{border-top: 1px solid #707070; border-bottom: 1px solid #707070; background: rgba(23,23,23,0.70); position: fixed; top: 61px; z-index: 3;}
.introWrap .introMenu.fixed ul li{border-top: none; border-bottom: none;}
.introWrap .introMenu.fixed ul li a{height: 54px; line-height: 54px}
.introWrap .introMenu.fixed ul li a:hover,.introWrap .introMenu.fixed ul li a.on{color:rgba(245,114,32,1.00);}

.introWrap #intro1 .subWrap1{width: 100%; height: 610px; background: url(../images/content/intro_bg1.jpg) center no-repeat; background-size: cover; color: #fff; padding-top: 94px;}
.introWrap #intro1 .subWrap1 em{color: #fff; font-size: 16px; text-align: center; width: 100%; display: block; font-weight: 100; line-height: 28px;}
.introWrap #intro1 .subWrap1 h1{font-size: 38px; width: 100%; text-align: center; font-weight: 100;  margin-bottom: 28px;}
.introWrap #intro1 .subWrap1 h1:before{content: ''; width: 46px; height: 1px; background: #fc955a; margin: 28px auto 38px; display: block;}
.introWrap #intro1 .subWrap1 h1 .fontHan{top:-2px;}
.introWrap #intro1 .subWrap1 p{font-weight: 100; width: 100%; text-align: center; line-height: 36px; font-size: 18px;}

.introWrap #intro1 .subWrap2{width: 100%; height: 540px; background: url(../images/content/intro_bg2.jpg) center no-repeat; background-size: cover; padding-top: 170px;}
.introWrap #intro1 .subWrap2 .txtWrap{float: left; color: #fff; padding-top: 30px;}
.introWrap #intro1 .subWrap2 .txtWrap h2{font-size: 26px; font-weight: normal; margin-bottom: 30px;}
.introWrap #intro1 .subWrap2 .txtWrap p{font-size: 16px;}
.introWrap #intro1 .subWrap2 .videoWrap{width: 350px; height: 196px; float: right;}

.introWrap #intro1 .subWrap3{width: 100%; height: 540px; background: url(../images/content/intro_bg3.jpg) center no-repeat; background-size: cover; padding-top: 170px; text-align: right;}
.introWrap #intro1 .subWrap3 .txtWrap{float: right; color: #fff; padding-top: 30px;}
.introWrap #intro1 .subWrap3 .txtWrap h2{font-size: 26px; font-weight: normal; margin-bottom: 30px;}
.introWrap #intro1 .subWrap3 .txtWrap p{font-size: 16px;}
.introWrap #intro1 .subWrap3 .videoWrap{width: 350px; height: 196px; float: left;}

.introWrap #intro2{background: #272727; padding-bottom: 60px; overflow: hidden;}
.introWrap #intro2 > section{width: 750px; margin: 0 auto; position: relative; height: 600px;}
.introWrap #intro2 > section h2{font-size: 54px; font-weight: 100; color: #f57220; position: absolute}
.introWrap #intro2 > section h2 span{font-size: 400px; color: #373737; position: absolute; z-index: 1; font-weight: bold; line-height: 400px;}
.introWrap #intro2 > section p{font-size: 15px; font-weight: 100; color: #fff; line-height: 24px; position: absolute; z-index: 2;}
.introWrap #intro2 > section .phone{display: block; background: url(../images/content/intro_phone.png) no-repeat; font-size: 0px; text-indent: -999px; position: absolute; z-index: 2;}

.introWrap #intro2 .subWrap1 h2{top:225px; left: 330px;}
.introWrap #intro2 .subWrap1 h2 span{top: -245px; left: -350px;}
.introWrap #intro2 .subWrap1 p{top: 310px; left: 330px;}
.introWrap #intro2 .subWrap1 .phone{width: 185px; height: 585px; background-position: -100px -34px; top: 107px; left: 115px;}

.introWrap #intro2 .subWrap2 h2{top:250px; left: 12px;}
.introWrap #intro2 .subWrap2 h2 span{top: -300px; left: 520px;}
.introWrap #intro2 .subWrap2 p{top: 335px; left: 12px;}
.introWrap #intro2 .subWrap2 .phone{width: 309px; height: 434px; background-position: -446px -34px; top: 145px; left: 330px;}

.introWrap #intro2 .subWrap3 h2{top:185px; left: 330px;}
.introWrap #intro2 .subWrap3 h2 span{top: -305px; left: -330px;}
.introWrap #intro2 .subWrap3 p{top: 270px; left: 330px;}
.introWrap #intro2 .subWrap3 .phone{width: 185px; height: 434px; background-position: -916px -34px; top: 78px; left: 115px;}

.introWrap #intro2 .subWrap4{height: auto;}
.introWrap #intro2 .subWrap4 .videoWrap{width: 729px; height: 411px; margin: 0 auto; margin-bottom: 60px;}
.introWrap #intro2 .subWrap4 .manual li{float: left; box-shadow: 0px 4px 35px 5px rgba(0,0,0,0.6); width: 352px; height: 91px; background: url(../images/content/intro_btn_bg.png) no-repeat; color: #fff; position: relative; padding: 20px 0 0 25px;}
.introWrap #intro2 .subWrap4 .manual li em{font-size: 11px;}
.introWrap #intro2 .subWrap4 .manual li p{font-size: 18px;}
.introWrap #intro2 .subWrap4 .manual li button{position: absolute; top: 20px; right: 20px; width: 49px; height: 49px; border-radius: 2px; background: #fff; font-size: 0; text-indent: -9999px;}
.introWrap #intro2 .subWrap4 .manual li button:after{content: ''; display: block; background: url('../images/common/ir_icon.png') no-repeat; width: 18px; height: 20px; position: absolute; top: 50%; left: 50%; margin: -10px 0 0 -9px;}
.introWrap #intro2 .subWrap4 .manual li.web{margin-left: 12px;}
.introWrap #intro2 .subWrap4 .manual li.web button:hover{background-color: #fc955a;}
.introWrap #intro2 .subWrap4 .manual li.web button:after{background-position: -436px -129px;}
.introWrap #intro2 .subWrap4 .manual li.mobile{float: right; background-position: 0 -91px; margin-right: 12px;}
.introWrap #intro2 .subWrap4 .manual li.mobile button:hover{background-color: #59a9b4;}
.introWrap #intro2 .subWrap4 .manual li.mobile button:after{background-position: -466px -129px;}

.introWrap #intro2 .subWrap4 .manual li.web button:hover:after,.introWrap #intro2 .subWrap4 .manual li.mobile button:hover:after{background-position: -496px -129px;}

.introWrap #intro3{clear: both; background: #ececec; overflow: hidden;}
.introWrap #intro3 p{width: 100%; text-align: center; font-size: 18px;line-height: 34px; margin: 50px 0;}
.introWrap #intro3 .biHis{background:url(../images/content/intro_bi.png) no-repeat -90px -34px; width: 712px; height: 107px; margin: 0 auto 65px; font-size: 0; text-indent: -999px;}
.introWrap #intro3 .biPri{margin: 0 auto; width: 715px;}
.introWrap #intro3 .biPri h2{font-size: 12px; color: #262626; margin-bottom: 10px;}
.introWrap #intro3 .biPri .logoType{background:url(../images/content/intro_bi.png) no-repeat -90px -229px;width: 715px; height: 298px; font-size: 0; text-indent: -999px;}


/* video 컨트롤러 */
.videoWrap{box-shadow: 0px 4px 35px 5px rgba(0,0,0,0.6); position: relative; cursor: pointer;}
/* .videoWrap:after{content: ''; width: 94px; height: 94px; display: block; background: url(../images/content/movie_play.png) no-repeat; position: absolute; top: 50%; left: 50%; margin: -47px 0 0 -47px; opacity: 0.7;} */
.videoWrap:hover:after{opacity: 1;}
.videoWrap.icoPlay:after{display: none;}

/*.videoWrap > video.hasMediaControlsHidden::-webkit-media-controls {display: none;}

.videoOverlayPlayButton {
	box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 10px calc(50% - 50px);
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    opacity: 0.8;
    cursor: pointer;
}

.videoOverlayPlayButton:hover {opacity: 1;}
.videoOverlayPlayButton.isHidden {display: none;}*/

/* 
.mainImgHover img{
	-webkit-transition: transform .2s;
    -moz-transition: transform .2s;
    -o-transition: transform .2s;
    transition: transform .2s;
}
 */
 
.mainImgHover:hover img {
	transform: scale( 1.1 );
	-webkit-transition: transform .3s;
    -moz-transition: transform .3s;
    -o-transition: transform .3s;
    transition: transform .3s;
}

.login-count{
	position: absolute;
	width:200px;
    height: 20px;
    left: 15px;
    bottom: 10px;
    overflow: hidden;
    text-align:left;
}

.login-count p {
	color: #fc955a;
    display: inline-block;
}
.login-count a.title{
	position: absolute;
	text-decoration: none;
    cursor: auto;
}
.login-count a.word {
	margin-left: 3px;
    text-decoration: none;
    cursor: auto;
}
/* 로그인 	방문자수 */
 .login-count .rolling-box{
 	left: 54px;
    margin-right: 10px;
    line-height: 24px;
    display: inline-block;
    position: relative;
	-webkit-transition:all 0.5s ease-out;
	-moz-transition:all 0.5s ease-out;
	-o-transition:all 0.5s ease-out;
	transition:all 0.5s ease-out;
	top: 0px;
}

.login-count .rolling-box.rolling{
    top: -22px;
}

.main .product-evt-wrap {display:flex; justify-content:space-between; padding:80px 0 0;}
.main .product-wrap {display:flex; flex-direction:column; flex:0 0 800px;}
.main .product-wrap-in {display:flex; justify-content:space-between; gap:20px;}
.main .product-latest {flex:0 0 538px; border-top:1px solid #d6d6d6; width:538px; line-height:63px;}
.main .product-latest ul + ul {border-bottom:1px solid #d6d6d6;}
.main .product-evt-wrap .product .titArea {margin:0;}
.main .product-evt-wrap .product .infoBox {min-height:auto;}
.main .evt-wrap {flex:0 0 450px;}
.main .evt-bnr {display:flex; flex-direction :column; padding-top: 5px;}
.main .evt-bnr > * + * {margin-top:43px;}
.main .evt-bnr img {height:140px;}