@charset "utf-8"; 
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); 
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,900);  

#wrap{position:relative; width:100%;overflow:hidden;}/* 전체 감싸고 있는 영역에 position:relative, min-width를 주어 scroll배너도 보이게 한다. */
.gnb,.header_top_cont,.header_search_cont,.main_goods_cont, .foot_list ul,.foot_cont,.foot_certify{}
.content_info{position:relative; width:1800px; margin:0 auto;}/* 컨텐츠 사이즈 + 센터정렬 */
.sub_content{position:relative; width:100%; margin:0 auto 0;     max-width: 100%;}/* 컨텐츠 사이즈 + 센터정렬 */


/* ============= 
* RESPONSIVE
* ============*/
@media (max-width: 1050px) {

    .gnb,.header_top_cont,.header_search_cont,.main_goods_cont, .foot_list ul,.foot_cont,.foot_certify{}
    .sub_content,.content_info{ width:100%;}/* 컨텐츠 사이즈 + 센터정렬 */
 
}



/* 메인페이지 공통타이틀 */
.main_title1 {position:relative; padding: 10px 0 50px;text-align:center;}
.main_title1 h2 {font-size:2.4rem;color:#333;font-weight:500;line-height:1.8;   text-align: left;letter-spacing: -0.02em;}
.main_title1 p {font-size:16px;color:#616161;font-weight:500;    text-align: left;}
/* 메인이미지 버튼 */
.main_title1  .btn_more { position:relative; display:block; width:200px; height:32px; margin:50px 0; box-sizing:border-box; text-align:center; line-height:30px; font-size:13px; color:#333; border:1px solid #888; }
.main_title1  .btn_more:hover { background:none; border:1px solid #000; color:#fff; background:#000;}

.main_title {position:relative; padding: 50px 0 50px;text-align:center;}
.main_title h2 {font-size:2.4rem;color:#333;font-weight:500;line-height:1.8;   text-align: center;}
.main_title p {font-size:16px;color:#616161;font-weight:500;    text-align: center;}


/* 메인 좌측 탭 */
.main_left_tab {z-index:10;position:fixed;left:0;top:50%;transform:translateY(-50%);}/*transform:translate(-70px, -50%);*/
.main_left_tab.on {transform:translate(0, -50%);}
.main_left_tab ul {font-size:0;}
.main_left_tab li {width:86px;height:340px;padding:0;border-radius:0 24px 24px 0;text-align:center;position:relative;z-index:1;display:block;margin:0;box-sizing:border-box;}
.main_left_tab li > a {display:block;position:absolute;left:0;top:0;z-index:3;width:100%;height:100%;}
.main_left_tab li > span.txt {font-size:13px;line-height:18px;letter-spacing:-0.65px;display:block;margin:0 auto;vertical-align:top;}
.main_left_tab li > h3 {width:20px;font-size:18px;line-height:26px;letter-spacing: -0.9px;font-weight:400;font-family: 'times', serif;display:block;margin:19px auto 22px;vertical-align:top;white-space: normal;  word-break: keep-all;    word-wrap: break-word;}
.main_left_tab li > span.icons {width:36px;height:36px;box-sizing:border-box;border-radius:100%;position:relative;z-index:1;display:inline-block;margin:0 auto;vertical-align:top;}
.main_left_tab li > span.icons:before, .main_left_tab li > span.icons:after {width:16px;height:1px;position:absolute;left:50%;top:50%;display:inline-block;content:"";}
.main_left_tab li > span.icons:before {transform:translate(-50%, -50%);}
.main_left_tab li > span.icons:after {transform:translate(-50%, -50%) rotate(90deg);}
.main_left_tab li:nth-of-type(1) {padding-top:60px;background:#fff;box-shadow:0 0 5px rgba(0, 0, 0, 0.19);}
.main_left_tab li:nth-of-type(2) {padding-top:48px;background:#333;}
.main_left_tab li:nth-of-type(1) span.txt {color:#6c6d71;}
.main_left_tab li:nth-of-type(2) span.txt {color:#fff;}
.main_left_tab li:nth-of-type(1) h3 {color:#2f3138;}
.main_left_tab li:nth-of-type(2) h3 {color:#fff;}
.main_left_tab li:nth-of-type(1) span.icons {background:#333;}
.main_left_tab li:nth-of-type(2) span.icons {background:#fff;}
.main_left_tab li:nth-of-type(1) span.icons:before, .main_left_tab li:nth-of-type(1) span.icons:after {background:#fff;}
.main_left_tab li:nth-of-type(2) span.icons:before, .main_left_tab li:nth-of-type(2) span.icons:after {background:#333;}

/********************* dmedi swiper *********************/

.swiper-container {
	width:100%;
    max-width:1800px;
	height:auto;

}
.swiper-slide {
	text-align:left;
	display:flex; /* 내용을 중앙정렬 하기위해 flex 사용 */
	align-items:flex-start; 
	justify-content:left; /* 좌우 기준 중앙정렬 */
}

.swiper-slide img{height:auto;    max-width: 100%;}

.swiper0{width:100%;  margin:0 auto; overflow:hidden;}
.swiper0 img{width:100%; }
.swiper0  h2{font-size:1.3rem;line-height:1.5;margin:0 auto;color:#333; padding:1rem 0 0;text-align:center;}
.swiper0  p {font-size:15px;line-height:1.3;margin:0 auto;color:#767474;text-align:center;}
.swiper0  p a {display:inline-block;width:100%;}



@media all and (max-width:1025px) {
    .swiper-container {width:100%; max-width:1000px;}
}

@media all and (max-width:820px)  {
    .swiper-container {width:100%; max-width:800px;}
}

@media all and (max-width:768px)  {
    .swiper-container {width:100%; max-width:760px;}
    .swiper0  h2{font-size:1rem;line-height:1.5;}
    .swiper0  p {font-size:13px;line-height:1.3;}
}

@media all and (max-width:430px)  {
    .swiper-container {width:100%; max-width:380px;}
}



/********************************* 
 슬라이드배너 부분 css 파일입니다.
 ********************************/
.m_con_01 {width:100%;padding:12rem 0;    font-family: Roboto; }
.m_con_01 .inner {max-width:1650px;margin:0 auto; display: flex;flex-wrap: wrap;}
.m_con_01 .left{width: calc(23% - 15px);}
#mixedSlider { position:relative; padding: 0 0;width: calc(77.8% - 15px);}


/* ============= 
 * RESPONSIVE
 * ============*/

@media (max-width: 1450px) {
    .m_con_01 {padding:50px 0; }
    .m_con_01 .inner {max-width:100%;display: block;margin: 0 0.5rem;}
    .m_con_01 .left {width:100%;}

    .main_title1  .btn_more{display:none;}
    #mixedSlider {width: 100%; padding: 0 0 3rem;}
}
@media (max-width: 1200px) {
    .main_title h2 {font-size:34px;}
}


@media (max-width: 750px) {
    .m_con_01 { padding: 50px 0 0;}
    .sub_content,.content_info{ width:100%;}/* 컨텐츠 사이즈 + 센터정렬 */
    .main_title {padding: 30px 0 0;}
    .main_title h2 {font-size:28px;}
    .main_title p{font-size:14px;}
    .main_title1{padding:30px 0 0;}
    .main_title1 h2 {font-size:2.3rem;}
    .main_title1 p {font-size:14px;}
    #mixedSlider {padding: 0 0;}
}
    





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


.wid_1600 { width: 100%;max-width: 1650px;margin: auto; font-family: Roboto; }
.mainsec_title02 {width:100%; overflow:hidden;max-width:1600px; position:relative; margin-bottom:9.5rem; }
.mainsec_title02:after {width:100%; height:1px; background:#000; position: absolute;   content: ''; top:50%; transform: translateY(-50%); z-index:0;  }
.mainsec_title02 h2 {font-size:3.4rem; color:#000; font-weight:bold; display:inline-block; padding-right:40px;  }

#mainCompany {width:100%;  position:relative; padding:110px 0 250px 0; overflow:hidden;}
#mainCompany .mainCompany_bg { background:#f1f1f1 url(../../dmedi/img/mainCompany_bg.jpg) left center/0% no-repeat; ;background-size: cover; width: 70%; height: 100%; position: absolute; top:0; left: 0; z-index:-2;  /*background: linear-gradient(90deg, #ececec 70%, #fff 70%); */}
#mainCompany .m_company_txt {float:left;}
#mainCompany .m_company_txt > dl {margin-top:3.5rem;}
#mainCompany .m_company_txt > dl > dt {font-size:2.7rem; font-weight:bold;color:#000;} 
#mainCompany .m_company_txt > dl > dd {font-size:1rem; color:#000; margin-top:1.5rem;}
#mainCompany .m_company_img {float:right;width:100%; max-width:957px;}
#mainCompany .m_company_img img {width:100%; max-width:957px;}

.video{position:relative;height:0;padding-bottom:56.25%;}
.video iframe {position:absolute;top:0;left:0;width:100%;height:100%;}

#mainCompany .m_company_txtbox {width:50%; max-width:789px; padding:2.5rem 5.0rem 4.0rem 5.0rem; background:#fff; position:absolute; bottom:12rem; z-index:1; box-sizing:border-box; z-index:9; box-shadow: 5px 8px 8px 0px rgba(134, 133, 133, 0.35);} 
#mainCompany .m_company_txtbox > a {display:block; width:100%; height:100%;}
#mainCompany .m_company_txtbox dl {}
#mainCompany .m_company_txtbox dl dt {font-size:2rem; font-weight:bold;}
#mainCompany .m_company_txtbox dl dd {color:#414141; font-size:1rem; margin-top:1.1rem; line-height:1.65; }
#mainCompany .m_company_txtbox .m_company_more {color:#9e9e9e; padding-right:160px; position:absolute; right:0; bottom:30px; 
                                                    z-index:99; display:inline-block; transition:all .6s ease; height:20px;}
#mainCompany .m_company_txtbox .m_company_more:after { width:140px; right:0px;  height:1px; background:#979797; position: absolute;   content: ''; top:12px; transition:all .6s ease; }
#mainCompany .m_company_txtbox:hover .m_company_more {color:#000;  padding-right:15px;   transition:all .6s ease; }
#mainCompany .m_company_txtbox:hover .m_company_more:after { width:0;  transition:all .6s ease; }


/* ============= 
 * RESPONSIVE
 * ============*/

@media screen and (max-width:1600px){
    #mainCompany .m_company_txt > dl {margin-top:1.5rem;}
    #mainCompany .m_company_img {float:right; margin-top:5.0rem;}
}

@media screen and (max-width:1024px){
    #mainCompany {padding:50px 0;}
    #mainCompany .m_company_txt {float:none;        padding: 0 1rem;}
    #mainCompany .m_company_txt > dl > dt {font-size:2rem; } 
    #mainCompany .m_company_txt > dl > dd {font-size:1rem; }
    #mainCompany .m_company_img {float:none;}

    #mainCompany .m_company_txtbox {position: relative;width:100%; padding:4.5rem 3.0rem 8.0rem 3.0rem; margin: 6rem 0 0;}
    #mainCompany .m_company_txtbox > dl > dd {line-height:1.45;}
}

@media screen and (max-width:975px){
    #mainCompany .m_company_txtbox {position:relative;  bottom:auto;  margin: 2rem 0 0; }
}

@media screen and (max-width:750px){
#mainCompany .m_company_img iframe {width:100% !important; height: auto;  min-height: 300px;}
}




/***********************************  

 동영상,스토리 부분 css 파일입니다.

 **********************************/

.m_con_02 {position:relative;width:100%;padding:7rem 0;margin:0 auto 0;    font-family: Roboto;}
.m_con_02 .inner  {max-width:1650px;margin:0 auto;overflow: hidden;} 
.m_con_02 .left {float:left;width:55.5%;margin-right:2%;margin:0 auto;}
.m_con_02 .right {float:right;width:42%;}
.m_con_02 .left iframe {width:100% !important;}

/* 딱지 */
.m_con_02 .sq {position:relative;float:left;background:#000;padding:10px 0 10px;margin-bottom:20px; margin-right:15px;width:115px;height:115px;color:#fff;text-align:center;font-size:25px;}
.m_con_02 .sq span {display:inline-block;background:#fff;width:30px;height:3px;margin:15px auto;text-align:center;}
.m_con_02 .title {overflow:hidden;}       
/* 텍스트 순서대로 */
.m_con_02 .title .sti {font-size:28px;font-weight:400; letter-spacing:-1px;}          
.m_con_02 .title .bti {font-size:28px;font-weight:900;margin-top:10px;line-height:1.2;letter-spacing:-2px;}         
.m_con_02 p.txt {display:inline-block;font-size:1rem;margin-top:20px;line-height: 1.6;}


.m_con_02 .img_point {
    position:absolute;top:-70px;left:50%;margin-left:550px;z-index:9;
    -webkit-animation: ud_move 3s infinite;
    -moz-animation: ud_move 3s infinite;
    -o-animation: ud_move 3s infinite;
    animation: ud_move 3s infinite;
}
 @keyframes ud_move {
    0% {top:-70px;} 
    60% {top:0px;} 
}

.m_con_02 .ban4 {display:inline-block; clear:both;margin-top:30px;}
.m_con_02 .more {position:absolute;display:block;bottom:30px;font-size:14px;color:#000;}
.m_con_02 .more img {margin-left:5px;}


/* ============= 
 * RESPONSIVE
 * ============*/

@media screen and (max-width:1599px) {
    .m_con_02 .inner  {max-width:100%;} 
}
@media screen and (max-width:1200px) {
    .m_con_02 {padding:0 0 0;}
    .m_con_02 .inner  {padding:3rem 0.5rem 0;} 
    .m_con_02 .img_point {top:10px;margin-left:380px;}
    @keyframes ud_move {
                0% {top:10px;} 
                60% {top:30px;} 
            }
}

@media screen and (max-width: 1024px) {
    .m_con_02 { background: #f1f1f1 url(../../dmedi/img/m_con_02_bg.jpg) left center/0% no-repeat;}
    .m_con_02 .left {float:none;margin:0 auto;width:100%;}
    .m_con_02 .left iframe {width:100% !important;height:auto; min-height:600px;}
    .m_con_02 .right {float:none;margin:30px auto 0;width:98%}
    .m_con_02 .title .sti {font-size:20px;font-weight:bold;}          
    .m_con_02 .title .bti {font-size:25px;font-weight:bold;margin-top:10px;line-height:1.2;}     
    .m_con_02 .more {position:relative;display:block;bottom:0;margin-top:20px;}
    .m_con_02 .img_point {display:none}

}







/* ============= 
브랜드 css 파일입니다.
 * ============*/

.bland_01{width:100%;background: url(../../dmedi/img/idea-bg.jpg) no-repeat center;background-size: cover ;    font-family: Roboto;}
.bland_01 .inner {max-width:1800px;margin:0 auto}
.row {display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;    margin: 0 0.5%;}
.leftview{    flex: 0 0 36%; max-width: 36%;    padding: 5% 0 0;}
.textb1{    color: #46c2f6;    font-size: 20px;    line-height: 180%;    font-weight: 400; }
.textb2{    color: #fff;    font-size: 50px;    line-height: 120%;    font-weight: bold; }
.textb3{    color: rgba(255,255,255,0.8);    font-size: 16px;    line-height: 150%;    font-weight:400;    padding: 10% 0;}
.bland_01 .more a{text-decoration: none; color: rgba(255,255,255,0.8); font-size: 18px; line-height: 180%; font-weight:600;    display: inline-block;    padding-bottom: 1%;    margin: 0 0 0 0; position: relative; text-decoration: none; text-transform: uppercase; }
.bland_01 .more a:after {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #fff;
  content: '';
  opacity: 0;
  -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
  transition: height 0.3s, opacity 0.3s, transform 0.3s;
  -webkit-transform: translateY(-10px);
  -moz-transform: translateY(-10px);
  transform: translateY(-10px);
}


.bland_01 .more a:hover:after, .bland_01 .more a:focus:after {
  height: 1px;
  opacity: 1;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}

.business{margin-top: 100px;position: relative;display:block;transition-delay: 1s;width: 100%;text-align: center;    font-family: Roboto;}
.business ul{display: inline-flex;position: relative;z-index: 1;}
.business li{transition: 0.5s;}
.business li ~ li{border-left: 1px solid rgba(255,255,255,0.1);}
.business li a{display: block;text-align: center;position: relative;}
.business li a:hover{background-color: rgba(0,0,0,0.15);transition: 0.3s;transition-delay: 0.1s;}
.business li a::before{content: "";width: 20px;height: 9px;background: url(../../dmedi/img/wh-arr.png) no-repeat center;background-size: contain;position: absolute;left: 50%;bottom: 30px;margin-left: -50px;opacity: 0;transition: 0.3s;transition-delay: 0.1s;}
.business li a > div{display: flex;align-items: center;justify-content: center;width: 190px;height: 230px;}
.business li a p{padding-top: 85px;background-repeat: no-repeat;background-position: center top;position: relative;z-index: 5;transition: 0.3s;}
.business li:nth-child(1){transition-delay: 1s;}
.business li:nth-child(2){transition-delay: 1.2s;}
.business li:nth-child(3){transition-delay: 1.4s;}
.business li:nth-child(1) a p{background-image: url(../../dmedi/img/business-icon1.png);}
.business li:nth-child(2) a p{background-image: url(../../dmedi/img/business-icon2.png);}
.business li:nth-child(3) a p{background-image: url(../../dmedi/img/business-icon3.png);}
.business li a p span{display: block;color: #1a6bae;font-size: 0.75rem;}
.business li a p strong{display: block;padding-top: 15px;color: #fff;font-weight: 400;font-size:16px;}

.business li a:hover p{padding-bottom: 40px;}
.business li a:hover::before{opacity: 1;margin-left: -10px;}

.special{width:100%; overflow: hidden;float: left;}
.special li {display: inline-block; width: 47.5%;padding: 20% 1% 1%;}
.special li img{width:100%;}
.special li:first-child{padding-left:0%;}

.rightview{display: block; }
.rightview .imgview{     position: relative;  }


/* ============= 
* RESPONSIVE
* ============*/
@media screen and (max-width:3000px) {
    .rightview img{max-width: 1200px; margin-left: 15%; }
}

@media (max-width: 1500px) { 
    .business ul{width: 100%;}
    .business ul li {width: 33.33%;}
    .business li a > div {width: 100%;}
}


@media (max-width: 1024px) { 
    #main_company .inner{ width: 100%; }

}


@media screen and (max-width:1050px) {
    .textb1{ text-align:center }
    .textb2{ font-size: 34px; text-align:center;    line-height: 1.5; }
    .textb3{  text-align:center ;font-size: 16px ;padding: 5% 0;}
    .bland_01 .more {border-bottom: 0px solid #000;    display: block;    padding-bottom: 1%;  text-align:center ;   margin-top: 10%;}


    .special li {width:49.3%;padding: 20% 0.5% 1% 0.5%;}
    .special li:last-child{padding-right:0%;}

    .leftview{flex: 0 0 100%; max-width: 100%;padding:15% 0 0;}


    .rightview img{max-width: 100%; margin-left:0%; }

}




@media screen and (min-width:1050px) {

    .col8{ flex: 0 0 60%; max-width: 60%;}

}



@media screen and (max-width:881px) {
    .special li {width:49.2%;padding: 20% 0.5% 1% 0;}
}


@media (max-width: 640px) { 
    .textb2{ font-size: 28px;  }
    .textb3{font-size: 14px ;padding: 5% 0 2%;    width: 80%;    margin: 0 auto;}
    .business{margin: 12% 0 0;}
}



/* 흐르는 텍스트 */
.txt_flow {
    display: flex;
    flex: 0 0 auto;
    white-space: nowrap;
    overflow: hidden;
    transition: 0.3s;
    margin-top: 7.9rem;
    color: rgba(0, 0, 0, 0.1);
    font-weight: 700;
    position: absolute;
}

.txt_flow p {
    animation: textLoop 25s linear infinite;
    padding-right: 1.4881vw;
    font-size: 10rem;
}

@keyframes textLoop {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@media (max-width:1024px) { 

	.txt_flow { margin-top: 2rem; }
	.txt_flow p { font-size: 12rem; }
}

@media (max-width: 640px) { 
	.txt_flow{        display: none;;}
	.txt_flow p { font-size: 6rem; }
}


/************************************  

긴배너, 갤러리 영역 css 파일입니다. 

************************************/
 
.gall {width:100%;margin:0 auto 0;padding:0 0 ;overflow:hidden; background: #f1f1f1;    font-family: Roboto; }
.gall .spban {width:100%;height:450px;background:#333 url(../../dmedi/img/spban_bg.jpg) no-repeat top center;background-attachment:fixed;background-size: cover;overflow:hidden;}
.gall .spban p {color:#fff;   text-align: center;    line-height: 1.3;} 
.gall .winner  {position:relative;width:1300px;margin: 30px auto 0;} 

.gall .spban .btn_more { position:relative; display:block; width:200px; height:32px; margin:50px auto; box-sizing:border-box; text-align:center; line-height:30px; font-size:13px; color:#fff; border:1px solid #000; background:#000; }
.gall .spban .btn_more:hover { background:none; border:1px solid #fff; }





.gall .inner  {position:relative;overflow:hidden;width:1300px;margin:130px auto;} 
.gall .r_right{ float:left;width:20%;}
.gall .r_left{ float:right;width:76% ; }
.gall h6 {font-size:18px;font-weight:300; line-height:1.5;   padding: 0 0 10px; border-bottom: 1px solid #888; width:120px;}
.gall h5 {font-size:40px;font-weight:bold;padding-top:20px;}
.gall h7 {font-size:18px;font-weight:300;padding-top:10px; }

.gall p img{padding-top:30px;}


/* 상품후기 */
.b_review_title { clear:both; display:block; text-align:center; line-height:30px; font-size:19px; color:#333333; font-weight:400; margin-bottom:20px;     font-family: Roboto;}
.b_review { clear:both; display:block; width: 100%;}
.b_review:after { clear:both; display:block; content:''; }
.b_review .b_review_item { float:left; width:25%; padding:0 7px; margin-bottom:14px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.b_review .b_review_item article { display:block; padding:0; border:1px solid #e5e5e5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }


.b_review_img { clear:both; display:block;overflow:hidden;}

.b_review_img img { width:100%; height:300px; object-fit:cover;transform:scale(1.0);transition: all 0.6s;}
.b_review_img img:hover{object-fit:cover;transform:scale(1.2);transition: all 0.6s;}




.b_review_info { clear:both; display:block; padding:10px; }
.b_review_info .PJ_board_review_point { clear:both; display:block; width:88px; height:15px; margin-bottom:5px; background:url("../img/icon/board/icon_star_bg.png") no-repeat left top; vertical-align:middle; }
.b_review_info .PJ_board_review_point span { display:block; background:url("../img/icon/board/icon_star_fill.png") no-repeat left top; }
.b_review_info h5 { font-size:15px; font-weight:bold;padding-bottom: 10px; }
.b_review_info p { font-size:12px; font-weight:300;height: 45px;  }
.b_review_info div.PJ_board_review_reg { clear:both; display:block; margin:5px 0 10px; font-size:12px; font-weight:300; color:#999999; }
.b_recommend { clear:both; display:block; margin-bottom:10px;margin-top:10px; border-top:1px dashed #dddddd; border-bottom:1px dashed #dddddd; padding:7px 0;    height: 35px; }
.b_recommend:after { clear:both; display:block; content:''; }
.b_recommend strong { font-size:12px; font-weight:300; float:left; }
.b_recommend strong span { }
.b_recommend a { background:#f1f1f1; float:right; padding:0 5px; }
.b_review_goods { clear:both; display:block; padding:0; }
.b_review_goods:after { clear:both; display:block; content:''; }
.b_review_goods img { float:left; width:18%; }
.b_review_goods span { float:right; width:78%; font-size:12px; font-weight:300; }



/* 후기 게시판 */
.mgall {position: relative; font-family: Roboto;}
.mgall li{position: relative; padding:8px 0 14px 10px;height:80px;border-top:1px solid #ededed;border-bottom:1px solid #ededed;}
.mgall li a {}
.mgall li img{width: 80px; position:absolute; left:0; top: 0;padding:10px 0px 10px 0px;}
.mgall li strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space: nowrap;font-size:16px;padding:18px 0px 0px 100px;}
.mgall li span{display:block;font-size:13px;padding:3px 0px 0px 100px;}
.mgall ul {text-align:left; } 


/* 갤러리 게시판 */
.portfolio {width:1300px;margin:0 auto; font-family: Roboto;}
.portfolio ul li {float:left;width:23%;padding:1% 1%;text-align:Center;transition: all 0.6s;}
.portfolio ul li:hover {background:#fff;box-shadow: 5px 5px 10px rgba(0,0,0,0.3);} 
.portfolio ul li img {width:100%;}
.portfolio ul li span {display:block;font-size:16px; padding:10px 0 0;} 


/* ============= 
* RESPONSIVE
* ============*/
@media (max-width: 1050px) {

    .gall .winner  {width:100%;} 
    .gall .spban p {width:100%;}

    .gall .inner  {;width:100%;margin:130px auto;} 
    .gall .r_right{ padding-left: 2%;}
    .gall .r_left{ float:right;width:74% ; }
    .b_review .b_review_item { width:33.33%;  }
    .mgall {position: relative;}
    .mgall li strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space: nowrap;font-size:16px;padding:18px 0px 0px 100px;}
    .mgall li span{display:block;font-size:13px;padding:3px 0px 0px 100px;}
    .mgall ul {text-align:left; } 
    .portfolio {width:1000px ;margin:0 auto;}
    .portfolio ul {text-align:center; } 

}



/************************************  

게시판 부분 css 파일입니다.

************************************/
.notice_sect {background-color: #f8f9fe; padding: 240px 0 }
.notice_sect .in {display: flex}
.notice_sect .in {width: 1650px; margin: 0 auto; max-width: 100%; padding: 0 20px}
.notice_sect .title_box {width: 25%; min-width: 220px; padding-right: 60px}
.notice_sect .title_box h2 {font-size: 48px;font-weight: 700;}
.title_box .support_sect_tit + .more_btn {margin-top: 80px ; }
.notice_sect .list_box { flex: 1 }
.notice_sect .list_box li a{display: flex ; padding: 40px 0; position: relative; transition: all .3s; align-items: center}
.notice_sect .list_box li a:hover {color: #065af5;}
.notice_sect .list_box li:first-child {border-top: 2px solid #000}
.notice_sect .list_box li {display: flex; padding: 0 0; position: relative;transition: all .3s;align-items: center;border-bottom: 1px solid #b7bbcd}
.notice_sect .list_box li .date {min-width: 110px; font-size: 20px; font-weight: 700; font-family: 'sam'; margin-right: 50px; letter-spacing: 1px}
.notice_sect .list_box li .text_box {position: relative; padding-right: 100px; min-width: 0; transform: translateY(-3px); width: 100%}
.notice_sect .list_box li .text_box .tit {font-size: 22px; font-weight: 600;;overflow: hidden;text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.notice_sect .list_box li .text_box .txt {font-size: 16px; margin-top: 10px;overflow: hidden;text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.notice_sect .list_box li .arr {position: absolute; top: 50%; right:20px; font-size:25px; transform: translateY(-50%); transition: all .3s}
.more {text-decoration: none; color: rgba(255,255,255,0.8); font-size: 18px; line-height: 180%; font-weight:600;    display: inline-block;    padding-bottom: 1%;        margin: 5% 0 0 2%; }
.more_btn {letter-spacing: 1px; font-weight: 500; font-size: 15px; position: relative; display: inline-block}
.more_btn:before {content: ""; position: absolute; left: 0; bottom: 0px; position: absolute; transform: translateY(100%); width: 0%; height: 3px; background: #2d51d6; transition: ease-in-out .3s}

.fa-light, .fal {font-weight: 300;font-family: "Font Awesome 6 Pro";
    -webkit-font-smoothing: antialiased;
    display: var(--fa-display,inline-block);
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto;}
.fa-arrow-right:before {content: "\f061";}




@media(max-width: 1200px){
.notice_sect,
.now_sect {padding: 160px 0}

.notice_sect .in {flex-wrap: wrap}

.notice_sect .title_box .more_btn {margin-bottom: 30px}
.notice_sect .list_box li a {min-width: 90px; margin-right: 30px; font-size: 18px; padding: 35px 0; margin-right: 0px}
.notice_sect .list_box li .date {min-width: 100px; font-size: 18px}
.notice_sect .list_box li .text_box {padding-right: 80px}
.notice_sect .list_box li .text_box .tit {font-size: 20px;}
.notice_sect .list_box li .text_box .txt { font-size: 14px;}
.notice_sect .list_box li .arr {font-size: 20px;}

}
@media(max-width: 1150px){
.notice_sect .list_box li .arr {display: none}
}
@media (max-width: 768px){
.gall .spban {;height:350px;;}
.gall .winner  {margin: 0 auto 0;} 
.notice_sect .title_box {width: 100%; min-width: 0; padding-right: 0; margin-bottom: 20px;}
.notice_sect .title_box a .more_btn {margin-bottom: 20px}
.notice_sect, .now_sect {    padding: 60px 0;}
.notice_sect .list_box li {flex-wrap: wrap; padding: 25px 0; font-size: 14px}
.notice_sect .list_box li a {flex-wrap: wrap; padding: 5px 0; font-size: 14px;    font-weight: 400;}
.notice_sect .list_box li .date {width: 100%;font-size: 15px;margin-right: 0}
.notice_sect .list_box li .text_box {padding-right: 0; margin-top: 15px}

.notice_sect .list_box li .text_box .tit {font-size: 17px;overflow: hidden;text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;white-space: normal;}
.notice_sect .list_box li .text_box .txt {font-size: 13px; margin-top: 5px}
.notice_sect .title_box h2 { font-size: 24px;display: inline-block;}
.notice_sect .more {float: right !important;padding: 2% 10% 0 0;font-size: 14px;  margin-top: 0;}

.more_btn.mo {margin: 0 auto;padding: 14px 15px 13px;width: 500px;font-size: 13px;text-align: center;margin-top: 40px;border: none;box-shadow: rgba(0, 00, 0, 0.1) 0px 4px 20px 0px;max-width: 100%;}

}

/* 리쿠르트 */
.recruit{height: 750px;overflow:hidden;    font-family: Roboto;}
.main-recruit-box{ width:100%;height:100%;margin: 0px auto;background:#333 url(../../dmedi/img/recruit_bg.jpg) no-repeat 50% 50% / cover;background-size: cover;overflow:hidden;}
.area-box{max-width: 1300px; height: 100%;margin: 0px auto;}
.recruit-con{display: flex;height:100%;}
.left-box{display: flex;width: 50%; border-right: 1px solid rgba(255,255,255,0.1);}
.con-box{width: 100%; padding-top: 21.68%;padding-left: 25px;    border-left: 1px solid rgba(255,255,255,0.1);    box-sizing: border-box;}
.tit01{position: relative;display: block;font-size:2.4rem;    letter-spacing: -0.03em;color: #fff;    font-weight: 500;}
.tit01:before{content: "";width: 3px;height: 27px;background-color: #fff;position: absolute;left: -25px;top: 50%;margin-top: -13.5px;}
.txt01{ font-size: 1rem;  color: rgba(255,255,255,0.6);margin-top: 1rem;  padding: 0 0 0 1.5rem;   font-weight: 300; }

.txt-box{display: flex;}
.txt-con{width: 33.33%;    padding-top: 10.68%;padding-left: 25px;box-sizing: border-box;}
.txt-icon{width: 100px; text-align: center;}

.txt-con h2 a{ display: block; width: 100px; font-size: 1rem; line-height:2; color:#fff; font-weight: 300;  margin: 1em 0 0;border: 1px solid rgba(255, 255, 255, 0.1);    transition: all 0.4s;    padding: 0.2em; text-align: center;    border-radius: 10px;}
.txt-con h2 a:hover { background: #2daae1;color:#fff; border: 1px solid rgba(255, 255, 255, 0);}
.rigth-box{display: block;  width: 50%;    padding: 0 0 0 6.98%;    box-sizing: border-box;}
.rigth-box .video{display: block; width: 100%; margin:15rem 0 10em;}
.main-sub-tit  {font-size: 1.2rem; font-weight: 600; color: #fff;}
.main-tit-box h2{ font-size: 2rem;line-height: 1.4;color: #fff; font-weight: 600;margin-top: 17px;}
.main-tit-box h2 span{color:#2daae1}



@media (max-width: 1200px){
    .recruit{height: 100%;;}
    .main-recruit-box{background:#333 url(../../dmedi/img/recruit_bg.jpg) no-repeat 50% 40% / cover;}
    .area-box{max-width: 100%; }
    .recruit-con{display: block;width: 100%;}
    .left-box{display: block;width: 100%; }
    .con-box{padding-left: 0; }
    .tit01{padding: 0  1.5rem;    text-align: center;}

    .tit01:before{width:27px;height: 3px;left: 47%; top: 0;}
    .txt01{ padding: 0  1.5rem; text-align: center;}
    .txt01:before{display:none;}
    .txt-con{width: 50%;}
    .txt-con{  padding-left: 14%;}
    .rigth-box{display: block;width: 100%;  padding: 0 0 7.22% 0;}
    .rigth-box .video{width: 90%; margin:5rem auto}
    .main-tit-box{width: 90%;    margin: 0 auto;}
    .main-tit-box h2{ font-size: 1.5rem;}

}


@media (max-width: 750px){
    .tit01{font-size: 1.5rem;}

}




/* 하단배너 */


.m_con_04 {width:100%; margin:0 auto ;padding:10rem 0 19rem;    position: relative;     font-family: Roboto;}

.ban5 {    display: flex;width: 80%;    max-width: 1300px;margin:0 auto;overflow:hidden;    flex-direction: row;    justify-content: space-around;}
.ban5 .box {float:left; margin-left:20px; width:46.5% ;height:auto;    background-color: #fff; overflow:hidden;}  
.ban5 .box:first-child {margin-left:0px;}
.ban5 .box .tit {margin:15px; font-size:1.5em;text-align: center;color: #333;}
.ban5 .box .txt {margin:20px 15px 0; font-size:14px;}
 

.ban5 .box a .img {position:relative;width:100%;height:auto;overflow:hidden;} 
.ban5 .box a .img {display:block;transition-duration:0.5s;}
.ban5 .box a .img img {width:100%;height:auto; 
        transition-timing-function:ease-in-out;
             -o-transition-timing-function:ease-in-out;
           -moz-transition-timing-function:ease-in-out;
        -webkit-transition-timing-function:ease-in-out;
                             transition-duration:0.5s;
                          -o-transition-duration:0.5s;
                        -moz-transition-duration:0.5s;
                     -webkit-transition-duration:0.5s;}
.ban5 .box a .img:hover img { 
       transform:scale(1.05,1.05);
      -o-transform:scale(1.05,1.05);
    -moz-transform:scale(1.05,1.05);
 -webkit-transform:scale(1.05,1.05);}
.ban5 .box a .img:hover {background:#000;}
.ban5 .box a .img:hover img {opacity:0.5;}

/* 이미지오버시 텍스트 */
.ban5 .box a span {display:none;position:absolute;top:50%;left:50%;margin-left:-60px;width:120px;height:27px;text-align:center;border-radius:15px;border:2px solid #fff;font-size:15px;line-height:27px;font-weight:400;color:#fff;letter-spacing:1px;z-index:10; }
.ban5 .box a span:after {display:block;position:relative;content:"+";margin-top:-80px;font-size:50px;}
.ban5 .box a:hover span {display:block;}
.ban5 .box a:hover span:after {  
        animation:bannerbtn01 0.5s ease-in-out forwards;
-webkit-animation:bannerbtn01 0.5s ease-in-out forwards;
   -moz-animation:bannerbtn01 0.5s ease-in-out forwards;
     -o-animation:bannerbtn01 0.5s ease-in-out forwards; } 


/* ============= 
 * RESPONSIVE
 * ============*/
@media (max-width: 1300px) { 
    
    .m_con_04 {width:100%;}
    .ban5 .box .img img {max-width:100%;}
    
}
@media (max-width: 1050px) { 
    .ban5 {width: 90%; }
    .m_con_04{padding: 3rem 0;}
}

@media (max-width:450px) { 
    
    .m_con_04 {width:100%; }
    .ban5 .box .tit {font-size:14px;font-weight: 400;}
        
}


/* //하단배너 */


/* 인스타그램 */
.insta {width:100%; max-width:1300px;margin:60px auto;    font-family: Roboto;} 
.insta inner{margin-left:-80px}
.insta h2{text-align:center;margin-bottom:20px;}
.insta h2 img {text-align:center;vertical-align: middle;}
.insta h2 a {font-size:13px;color:#797979;margin-left:20px;}

.amazon_scroller{
    padding: 0px;
    margin: 0px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -khtml-border-radius: 10px;
}
.amazon_scroller .amazon_scroller_nav{
    position: absolute;
}
.amazon_scroller .amazon_scroller_nav li{
    cursor: pointer;
    position: absolute;
}
.amazon_scroller .amazon_scroller_mask{
    position: absolute;
    margin-left: 0px;
    margin-right: 0px;
    overflow: hidden;
}
.amazon_scroller ul{
    padding: 0px;
    margin: 0px;
    float: left;
}
.amazon_scroller ul li{
    padding: 0px;
    margin: 0px;
    margin-left: 5px;
    margin-right: 5px;
    list-style: none;
    float: left;
    text-align: center;
    display:inline;
}
.amazon_scroller ul li a{
    text-decoration: none;
}
.amazon_scroller ul li a amazon_scroller_title{
    overflow:hidden;
}
.amazon_scroller ul li a:hover{
    text-decoration: underline;
}
.amazon_scroller ul li a img{
    border: none;
}