@font-face { font-family: 'Binggrae'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/Binggrae.woff') format('woff'); font-weight: normal; font-style: normal; }
body{color: #222;}
p{line-height: 1.6}
mark{color:#ff7223;background: none; font-style: normal;}
.share_wrap{letter-spacing: -0.05em !important;}
.Binggrae-Bold{font-family:'Binggrae-Bold'; }
.Binggrae{font-family: 'Binggrae';}
.inner_box{max-width: 1160px; margin: 0 auto;transition: all 0.3s; transition-delay: 0.3s;}
.m-tt-img,.m_br_200416,.con02_img span,.mobil_menu,.con01-img01-m{display: none;}


.con01{background:url('../images/sharing_campaign/con01-bg.png') center top no-repeat;padding-bottom: 165px;background-size: cover;}
.con02{background:url('../images/sharing_campaign/con02-bg.png') center top no-repeat;margin-top: -52px;background-size: cover;}
.con04{background:url('../images/sharing_campaign/con04-bg.png') center center no-repeat;background-size: cover;}


.share_wrap{position: relative;}
.share_wrap.hide .fix_menu{display: none;}

.share_wrap .fix_menu{position: fixed; top:217px;; left:50%;transform: translateX(-50%);width: 1399px;z-index: 99;display: block;}
.fix_box{
  position: absolute;
  right: 0; top:0;
  width: 115px;
  overflow: hidden; border-radius: 50px;
  background: #fff; border:7px solid #ffdd95;
  box-sizing: border-box; padding: 34px 10px 8px;
  text-align: center;
 }

.fix_box span{font-size: 18px;line-height: 1.6;}
.fix_box ul{margin-top:20px;}
.fix_box li{background-color:#ff7e2a ;   border-radius: 50%;overflow: hidden; margin-bottom: 12px;}
.fix_box li a{font-size: 18px; color:#fff;padding:19px;display:inline-block;}
.fix_box li:hover{background-color:#ff8e45 ;}
.fix_box li:last-child{background-color:#00ac6d ;}
.fix_box li:last-child:hover{background-color: #00b875;}


.share_header{padding-top: 43px;overflow: hidden;margin-bottom: 98px;}
.share_header h1{margin-left: 69px;float: left}
.share_header span{display: inline-block;float: right;margin-right: 69px;}
.con01 .inner_box{position:relative;}
.video_wrap{width: 1072px;  margin: 0 auto;padding-bottom: 40px; background:url('../images/sharing_campaign/shadow.png') center bottom no-repeat;position: relative;z-index: 10;}
.video_box{

  width: 100%;
  height: 623px;
  overflow: hidden;
  border-radius:30px;
  padding: 10px;
  background: #ffc960;
  background: -webkit-linear-gradient(20deg, #ffc960, #ffa800);
  background: linear-gradient(20deg, #ffc960, #ffa800);
  box-sizing: content-box;
  cursor: pointer;
}
.video_box video{overflow: hidden;border-radius: 24px;}

.con01-img{position: relative;}
.con01-img span{display: inline-block; position: absolute;}
.con01-imgpo-01{bottom:0;left:-122px}
.con01-imgpo-02{bottom:0;right:-170px;}

.con02{padding-top: 115px;padding-bottom: 83px;}
.con02 .inner_box{overflow: hidden;}
.con02 .inner_box>div{width: 50%; float: left;}
.con02_tt{padding-left: 215px;}
.con02_tt .Binggrae-Bold{font-size:45px }
.con02_tt p{font-size: 20px;line-height: 1.6; font-weight: 300; margin-top: 30px;}
.con02_tt p mark{font-weight: 500}
.con02_tt p span{font-size:16px; color:#9c6d11;}
.con02_img{padding-left: 23px;}

.con03{padding-top: 149px;}
.con03 .Binggrae-Bold{font-size: 60px; text-align: center;display:inline-block;width: 100%;}
.con03 ul{overflow: hidden;margin: 50px 0}
.con03 ul li{display: inline-block; width: 33.33%;float: left; text-align: center;margin: 50px 0}
.con03_tt {margin-top: 30px;}
.con03_tt span{font-size: 18px;font-weight: 300}
.con03_tt p{ font-size: 26px;margin-top: 10px; }
.con03_con{border-top: 1px solid #d6d6d6;padding-top: 50px; padding-left: 72px;overflow: hidden;margin-bottom: 160px;}
.con03_con p{color:#666;font-size:18px; font-weight: 100; line-height: 1.6; display: inline-block;}
.con03 .con03_con a{display: block; border-radius: 50px; background-color: #aaa; font-size: 20px; color:#fff;float: right;width: 172px;height: 64px; line-height: 64px;}
.con03 .con03_con a:hover{background-color: #ff7e2a;}



.con04{padding: 120px 0;    height: 449px; }
.con04 .inner_box{overflow: hidden;}
.con04_tt{width: 50%; float: right;padding-left: 40px;}
.con04_tt span{display: inline-block;width: 100%}
.con04_tt .Binggrae{font-size: 30px;margin-bottom: 10px;}
.con04_tt .Binggrae-Bold{font-size:45px;}
.con04_link{margin-top: 40px;}
.con04 .con04_link a{text-align: center;display: inline-block;font-size:20px;width: 185px; height: 69px; border-radius: 50px; line-height: 70px;color: #fff;background-color:#ff7e2a; }
.con04_link a:hover{background-color: #ff8e45}
.con04_link a:last-child{background: #00ac6d;margin-left: 20px;}
.con04_link a:last-child:hover{background-color: #00b875;}


.con05{text-align:center;margin-top: 140px;}
.con05 .inner_box>span{font-size: 60px;}
.con05_ul{display: table;margin-top: 100px;}
.con05_ul li{display: table-cell; width: 1%;}
.con05_con{margin-top: 36px;}
.con05_con span{font-size: 30px; }
.con05_con p{font-size: 18px;color: #666;margin-top: 30px;font-weight: 200}
.con05-sns{border-top: 1px solid #d6d6d6; padding: 38px 70px 0;margin-top: 50px;text-align: left;overflow: hidden;}
.con05-sns>span{display: inline-block;font-size: 30px; position: relative;}
.con05-sns>span::after{content: ''; display: block;position: absolute;width: 9px;height: 9px;background-color: #ff7e2a; border-radius: 50%;top:-5px; left: -10px}
.con05-sns ul{float: right;}
.con05-sns ul span{font-size: 0; opacity: 0; text-indent: 99999em}
.con05-sns ul li{cursor: pointer; display: inline-block;width: 61px;height: 61px; background: url('../images/sharing_campaign/sns-icon01.png') center center no-repeat;background-size: contain;}
.con05-sns ul li:nth-child(2){ background: url('../images/sharing_campaign/sns-icon02.png') center center no-repeat;background-size:contain;}
.con05-sns ul li:nth-child(3){ background: url('../images/sharing_campaign/sns-icon03.png') center center no-repeat;background-size:contain;}
.con05-sns ul li:nth-child(4){ background: url('../images/sharing_campaign/sns-icon04.png') center center no-repeat;background-size:contain;}
.con05-sns ul li:not(:first-child){margin-left: 30px;}

.con05-sns ul li:hover{background: url('../images/sharing_campaign/sns-icon01-h.png') center center no-repeat;}
.con05-sns ul li:nth-child(2):hover{ background: url('../images/sharing_campaign/sns-icon02-h.png') center center no-repeat;}
.con05-sns ul li:nth-child(3):hover{ background: url('../images/sharing_campaign/sns-icon03-h.png') center center no-repeat;}
.con05-sns ul li:nth-child(4):hover{ background: url('../images/sharing_campaign/sns-icon04-h.png') center center no-repeat;}



.share_footer{background-color: #32393f;padding: 43px 0 61px;margin-top: 120px;}
.s_fter{overflow: hidden;max-width: 1400px; margin: 0 auto;color:#878f96}
.fter_l{float: left;}
.fter_l p{font-size: 18px; font-weight: 300;margin-bottom: 52px;}
.fter_l p b{font-size: 26px; font-weight: bold;}
.fter_l span{font-weight: 300;font-family: Gulim,'굴림';}
.fter_r{float:right;}



@media all and (max-width:1520px) {
  .inner_box{padding: 0 81px;}
  .video_wrap{width: 820px;background-size: contain;}
  .video_box{height: 476px;}
  .con01-imgpo-01{left:-66px;}
  .con01-imgpo-02{right: -124px;}
  .share_wrap .fix_menu{width: 1220px;}
  .fix_box{width: 100px;}
  .fix_box span,.fix_box li a{font-size: 16px;}
  .fix_box ul{margin-top: 10px;}
  .fix_box li a{padding: 10px;}
  .s_fter{padding: 0 81px;}
}


@media all and (max-width:1280px){
.share_wrap .fix_menu{width: 100%;}
.share_header h1{width: 30%}
.share_header span{width: 30%;}
.video_wrap{width: 600px;}
.video_box{height: 348px;}
.con01-imgpo-01{left:-33px;}
.con01-imgpo-02{right: -65px;}
.con02_tt{padding-left: 40px;}
.con02_img{padding-left: 0}
.con03 .Binggrae-Bold{font-size: 50px;}
.con04_tt{padding-left: 0}
.con05_img{width: 80%; display: inline-block;}
}

@media all and (max-width:1024px){
  .play_pause{display: none !important}
.share_wrap.hide .fix_menu {display: block !important;}
.share_header{padding-top: 30px;}
.share_header h1{width: 38.5%;}
.inner_box{padding: 0 45px}

.share_wrap .fix_menu{top:auto;bottom:0;}
.fix_box,.share_header span{display: none;}

.mobil_menu{display: block;overflow: hidden;text-align: center;}
.mobil_menu a{display: inline-block;width: 50%;float: left;background-color: #ff7e2a; color:#fff;font-size: 32px;padding: 43px 0}
.mobil_menu a:last-child{background-color: #00ac6d}

.con01{background:url('../images/sharing_campaign/con01-bg-m.png') center top no-repeat;background-size: cover;}
.con02{background:url('../images/sharing_campaign/con02-bg-m.png') center top no-repeat;background-size: cover; position: relative;z-index: 20}
.con04{background:url('../images/sharing_campaign/con04-bg-m.png') center top no-repeat;background-size: cover;}

.m-tt-img{display: block;text-align: center;}
.con01 .inner_box{padding: 0 0px}
.con01-img{position: absolute;top:97px; width: 100%; left: 0;}
.con01-img span{width: 19%;}
.con01-img .con01-imgpo-01{left:61px;bottom:-13px;}
.con01-imgpo-01 img{display: none;}
.con01-imgpo-01 .con01-img01-m{display:block;}
.con01-img .con01-imgpo-02{right:44px;bottom:-27px;width: 20%;}
.video_wrap{margin-top: 82px;width: 652px;left: -10px;}
.video_box{height: 383px;}


.con02{margin-top: -53px;padding-bottom: 124px;}
.con02 .inner_box>div{width: 100%; float: none;}
.con02_tt{padding-left: 0; text-align: center;}
.con02_tt p span{display: none}
.con02_img{text-align: center; margin-top: 72px;margin-bottom: 36px;}
.con02_img span{display: block;color:#9c6d11; font-size:26px; font-weight: 300}
.con02_tt .Binggrae-Bold{font-size: 60px;}
.con02_tt p{font-size:30px;}

.m_br_200416{display: block;}
.con03{padding-top: 120px;}
.con03_con{margin-bottom: 80px;}
.con03 .Binggrae-Bold{font-size: 60px;line-height: 1.4}
.con03 ul{margin: 63px 0}
.con03 ul li{width: 50%;}
.con03_con{padding-left: 0;text-align: center;}
.con03_tt span{font-size:26px;}
.con03_tt p{font-size: 34px;}
.con03_con p{font-size: 26px ;display: block;}
.con03_con p br{display: none;}
.con03_con p .m_br_200416{display: block;}
.con03 .con03_con a{float: none;margin: 53px auto; font-size: 31px;padding: 30px 90px;border-radius: 73px;}


.con04_tt{width: 100%;text-align: center;}
.con04_link{display: none;}
.con04{height: 817px;}
.con04_tt .Binggrae{font-size: 34px;}
.con04_tt .Binggrae-Bold{font-size: 60px;}


.con05{margin-top: 87px;}
.con05_ul li{display: inline-block;text-align: center; width: 100%}
.con05_ul li:nth-child(2){margin: 94px 0;}
.con05_img{padding: 0}
.con05_con {margin-top: 78px}
.con05_con span{font-size: 40px;}
.con05_con p{font-size: 28px;}
.con05-sns{margin-top: 116px;text-align: center;}
.con05-sns ul{float: none;margin-top: 39px;}
.con05-sns ul li{width: 108px;height: 108px;}
.con05-sns>span{font-size: 40px;}
.con05-sns ul li{background: url('../images/sharing_campaign/sns-icon01-m.png') center center no-repeat; background-size: contain;;}
.con05-sns ul li:nth-child(2){ background: url('../images/sharing_campaign/sns-icon02-m.png') center center no-repeat;background-size: contain;;}
.con05-sns ul li:nth-child(3){ background: url('../images/sharing_campaign/sns-icon03-m.png') center center no-repeat;background-size: contain;;}
.con05-sns ul li:nth-child(4){ background: url('../images/sharing_campaign/sns-icon04-m.png') center center no-repeat;background-size: contain;;}

.con05-sns ul li:hover{background-image:url('../images/sharing_campaign/sns-icon01-m.png') ; }
.con05-sns ul li:nth-child(2):hover{background-image:url('../images/sharing_campaign/sns-icon02-m.png') ;}
.con05-sns ul li:nth-child(3):hover{background-image:url('../images/sharing_campaign/sns-icon03-m.png') ;}
.con05-sns ul li:nth-child(4):hover{background-image:url('../images/sharing_campaign/sns-icon04-m.png') ;}


.s_fter{position: relative; padding: 0; padding-bottom: 220px;}
.fter_l,.fter_r{float: none;    position: relative;top: 120px;padding-left: 45px;}
.fter_l p{font-size: 22px;}
.fter_l p b{font-size: 30px;}
.fter_l p br{display: none;}
.fter_l p .m_br_200416{display: block;}
.fter_r{position: absolute; top:0;left:0px;; border-bottom: 1px solid #878f96; width: 100%;padding-bottom: 17px;padding-left: 45px;}
.fter_l span{font-size: 20px;font-family: Gulim,'굴림';}
.share_footer{padding: 23px 0 61px;}
}




@media all and (max-width:768px){
  .inner_box{padding: 0 30px;}
  .video_wrap{width: 424px;    padding-bottom: 26px;}
  .video_box {height: 248px;}
  .share_header h1{margin-left: 30px;}
  .m-tt-img{width: 317px; margin: 0 auto;}
  .share_header{margin-bottom: 20px;}
  .con01-img .con01-imgpo-01{left:32px; bottom: 28px;}
  .con01-img .con01-imgpo-02{right: 22px; bottom:23px;}
  .con01{padding-bottom: 75px;}
  .con02_tt .Binggrae-Bold{font-size: 40px;}
  .con02{padding-top: 74px;padding-bottom: 80px;}
  .con02_tt p{font-size:20px;margin-top: 20px;}
  .con02_img{margin-top: 46px;}
  .con02_img span{font-size: 17px;}
  .con03 .Binggrae-Bold{font-size: 39px;}
  .con03 {  padding-top: 84px;}
  .con03 ul{margin: 0}
  .con03 ul li img{width: 90%;}
  .con03_tt span{font-size: 17px;}
  .con03_tt p{font-size: 22px;}
  .con03_con p{font-size:17px;}
  .con03 .con03_con a{font-size:20px;    width: 111px;  height: 41px;  line-height: 41px;padding: 15px 40px;}
  .con03_con{padding-top: 40px; margin-bottom: 80px;}
  .con04_tt .Binggrae{font-size:22px;}
  .con04_tt .Binggrae-Bold{font-size:39px;}
  .con04 {height: 532px;padding: 78px 0;}
  .con05 .inner_box>span{font-size:39px;}
  .con05{margin-top:56px; }
  .con05_ul{margin-top: 65px;}
  .con05_con span{font-size:26px;}
  .con05_con p{font-size: 18px;}
  .con05_con{margin-top: 50px;}
  .con05_ul{margin-top: 42px;}
  .con05_img{width: 80%;margin: 0 auto;}
  .con05_ul li:nth-child(2){margin: 61px 0}

  .con05-sns>span{font-size: 26px;}
  .con05-sns{padding: 38px 0px 0;}
  .con05-sns ul li{width: 71px;height: 71px;}
  .fter_l p {font-size: 14px;margin-bottom: 33px;}
  .fter_l p b {font-size: 19px;}
  .fter_l span{font-size: 13px}
  .fter_l{top:94px;padding-left: 35px;}
  .fter_r{padding-left: 35px;}
  .fter_r img{width: 50%;}
  .mobil_menu a{font-size:20px; padding:27px 0 }
  .s_fter{padding-bottom: 140px;}
}
@media all and (max-width:768px) and (min-width:687px){
  .con01-img .con01-imgpo-01{bottom: -12px;}
  .con01-img .con01-imgpo-02{bottom:-29px;}
}

@media all and (max-width:500px){
  .video_wrap{width: 318px;padding-bottom: 16px;}
  .video_box{height: 185px;}
  .m-tt-img{width: 237px;}
  .con01-img .con01-imgpo-01{left: 0; bottom:50px;}
  .con01-img .con01-imgpo-02{right: 0; bottom: 34px;}
  .con02_tt .Binggrae-Bold{font-size: 30px}
  .con02_tt p {font-size: 15px;margin-top: 15px;}
  .con02 {  padding-top: 55px;  padding-bottom: 60px;}
  .con02_img {margin-top: 34px;margin-bottom: 0}
  .con02_img span {  font-size: 12px;}
  .con03 .Binggrae-Bold {  font-size: 29px;}
  .con03 {  padding-top: 63px;}
  .con03 .Binggrae-Bold {font-size: 21px;}
  .con03 ul li{margin: 25px 0}
  .con03_tt{margin-top: 15px;}
  .con03_tt span {font-size: 12px;}
  .con03_tt p {font-size: 16px;margin-top: 5px;}
  .con03_con {  padding-top: 30px;margin-bottom: 60px;}
  .con03_con p {  font-size: 12px;}
  .con03 .con03_con a{margin: 26px auto;    width: 83px;height: 30px;line-height: 30px;}
  .con04_tt .Binggrae {  font-size: 16px;}
  .con04_tt .Binggrae-Bold {  font-size: 29px;}
  .con04 {height: 400px;  padding: 58px 0;}

  .con05 {  margin-top: 42px;  }
  .con05 .inner_box>span {  font-size: 29px;}
  .con05_ul {  margin-top: 31px;}
  .con05_img{width: 60%}
  .con05_con {  margin-top: 37px;}
  .con05_con span {font-size: 19px;}
  .con05_con p{font-size:13px; margin-top: 15px;}
  .con05_ul li:nth-child(2) {margin: 45px 0;}
  .con05-sns{margin-top: 58px;}
  .con05-sns ul{margin-top: 19px;}
  .con05-sns ul li {width: 52px;height: 52px;}
  .con05-sns ul li:not(:first-child) {margin-left: 10px;}
  .fter_l p {  font-size: 12px;  margin-bottom: 20px;}
  .fter_l p b {  font-size: 14px;}
  .fter_l{top:83px}
  .mobil_menu a{font-size: 15px;    padding: 20px 0;}


}

@media all and (max-width:375px){
  .inner_box {  padding: 0 15px;}
  .video_wrap {  width: 254px;  padding-bottom: 12px;    margin-top: 32px;}
  .video_box {  height: 148px;}
  .m-tt-img {  width: 189px;  margin-top: 30px;}
  .con01-img .con01-imgpo-02{bottom:46px;}
  .con02 {padding-top: 44px;  padding-bottom: 48px;}
  .con02_tt .Binggrae-Bold {  font-size: 24px;}
  .con02_tt p {  font-size: 12px;  margin-top: 12px;}
  .con02_img {  margin-top: 27px;}
  .con03 {  padding-top: 50px;}
  .con03_tt p {  font-size: 14px;  margin-top: 3px;}
  .con03 ul li img {  width: 80%;}
  .con03 ul li {  margin: 20px 0;}
  .con03_con {  padding-top: 24px;  margin-bottom: 30px;}
  .con03 .con03_con a {
    margin: 20px auto;
    width: 66px;
    height: 24px;
    line-height: 24px;
    font-size: 14px
  }
 .con04_tt .Binggrae {  font-size: 12px;}
 .con04_tt .Binggrae-Bold {  font-size: 23px;}
 .con04 {  height: 240px;  padding: 34px 0;}
 .con05 .inner_box>span {font-size: 23px;}
 .con05_con span {font-size: 15px;}
 .con05_con {  margin-top: 29px;}
 .con05_con p {font-size: 12px;margin-top: 12px;}
 .con05_img { width: 50%;}
.con05_ul {margin-top: 24px;}
.con05_ul li:nth-child(2) {margin: 36px 0;}
.con05-sns {margin-top: 34px;padding: 19px 0px 0;}
.share_footer{margin-top: 40px}
.con05-sns>span {font-size: 22px;}
.con05-sns ul {margin-top: 10px;}
.con05-sns ul li {width: 40px;height: 40px;}
.mobil_menu a {font-size: 14px;padding: 18px 0;}






}
/*20200420 추가*/
.video_wrap{position: relative;}
.video_box video{outline: 0 !important;}
.play_pause{
  /*display: none;*/
  width: 9%;
  height: 14%;
  background: #ff7e2a;
  border-radius: 100%;
  overflow: hidden;
  outline: 0;
  text-align: center;
  position: absolute;
  top: 50%;
  margin-top: -2%;
  left: 50%;
  margin-left: 1.7%;
}
.play_pause{
  position: absolute;
  top: 50%; left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.play_pause.on .pause{display: block;}
.play_pause.on .play{display: none}
.play_pause .pause{display: none;}
.play_pause .play{display: block}


@media all and (max-width:375px){

}








/**/