@charset "utf-8";

*{box-sizing: border-box;}

/* header */
#header {position: fixed;top: 0;left: 0;width: 100%;border-bottom: 1px solid rgba(255, 255, 255, 0.251);z-index: 3;}

.hd_wrap {display: flex; justify-content: space-between; height: 70px; padding: 0 10px;}
.hd_wrap h1 a{display: block;height: 100%;padding-left: 70px;background: url('/upload_data/board_data/BBS_0000160/176956823629420.png') no-repeat 10px 15px;background-size: 50px;font-family: 'GongGothic', 'san-serif';font-weight: 600;font-size: 14px;color: #fff;line-height: 70px; transition: none;}

.gnb .gnb_wrap {position: absolute; top: 0; left: -100000px;}
.gnb.on .gnb_wrap {height: 100vh;left: 0;z-index: 1;overflow-y:auto;}
.gnb.on .gnb_wrap::after {display: block; position: absolute; top: 70px; left: 0; z-index: 3; width: 100%; height: 1px; background: #00000017; content: '';}

.gnb .btn_gnb {position: absolute;right: 10px;top: 23px;width: 24px;height: 24px;background: url('/images/jbsports/common/gnb_ico.png') no-repeat 3px -1px;}
.gnb .btn_gnb span {font-size: 0;}
.gnb .btn_gnb.gnb_open {background-position: 3px -161px; transform: scaleX(-1);}
.gnb .btn_gnb.gnb_close {background-position: 0px -247px;}

.gnb_wrap {width: 100%;padding: 210px 10px 0 10px;background: #fff;}
.gnb_wrap .menu_box .depth1>a{display: block;position: relative;height: 60px;padding: 0 10px;border-bottom: 1px solid #bddfd0;border-radius: 20px 20px 0 0;line-height: 60px;font-family: 'GongGothic', 'san-serif';font-weight: 300;color: #212121;}
.gnb_wrap .menu_box .depth1>a:after{display: block;position: absolute;top: 50%;transform: translateY(-50%);right: 15px;width: 24px;height: 24px;background: url('/images/jbsports/common/gnb_ico.png') no-repeat 6px -175px;background-size: 30px;content:'';}
.gnb_wrap .menu_box .depth2 {padding: 15px; background: #bddfd0; border-radius: 2px 2px 20px 20px;}
.gnb_wrap .menu_box .depth2 a{line-height: 30px; font-size: 17px; font-weight: 400;}
.gnb_wrap .menu_box .depth2 {display: none;}
.gnb_wrap .menu_box .depth1.select .depth2 {display: block;}
.gnb_wrap .menu_box .depth1.select>a{background-color: #008349; color: #fff;}
.gnb_wrap .menu_box .depth1.select>a:after {transform: rotate(180deg);top: 33%;}
.gnb_wrap .menu_box .depth1>a:hover,
.gnb_wrap .menu_box .depth1>a:active,
.gnb_wrap .menu_box .depth1>a:focus {background-color: #008349; color: #fff;}
.gnb_wrap .menu_box .depth2 a:hover,
.gnb_wrap .menu_box .depth2 a:active,
.gnb_wrap .menu_box .depth2 a:focus {text-decoration: underline;}


/* 새창열림메뉴 스타일 */
.gnb_wrap .menu_box .depth2 a {position: relative;}
.menu_box .new_win, .l_gnb .new_win {position: absolute;right: -20px;width: 23px;height: 23px;background: url('/images/jbsports/common/icon.png') no-repeat 0 -596px;font-size: 0;background-size: 90px;}
.l_gnb .new_win {background-position: 0 -643px;}

.gnb_wrap .util {position: absolute; top: 0; left: 0;}
.gnb_wrap .util ul {display: flex;}
.gnb_wrap .util li a {position: relative;display: block;padding: 0 0 0 35px;line-height: 70px;font-size: 16px;color: #696969;font-weight: 500;transition: none;}
.gnb_wrap .util li a::before {display: block;position: absolute;top: 22px;left: 6px;width: 24px;height: 24px;background: url('/images/jbsports/common/gnb_ico.png') no-repeat;content: '';}
.gnb_wrap .util ul .g_login a::before {background-position: 4px -38px;} 
.gnb_wrap .util ul .jinan_home a::before {background-position: 4px -120px;} 
.gnb_wrap .util ul .g_sitemap a::before {background-position: 4px -199px;} 
.gnb_wrap .util ul li a:hover, .gnb_wrap .util ul li a:active, .gnb_wrap .util ul li a:focus {text-decoration: underline;}

.btn_paragame {width: 90%;height: 100px;position: absolute;top: 90px;left: 50%;transform: translateX(-50%);text-align: center;}
.btn_paragame a {display: block;position: relative;font-family: 'GongGothic', 'san-serif';font-weight: 600;font-size: 16px;color: #fff;line-height: 100px;background: #008349;border-radius: 20px;}

/* 디데이 */
.d_day {position: absolute;top: 68px;right: 0; width: 70px;height: 65px;background: url('/images/jbsports/main/d_day_ico.png') no-repeat center top;background-size: 70px;}
.d_day p {font-family: 'GongGothic', 'san-serif';font-weight: 300;font-size: 16px;color: #fff;line-height: 50px;text-align: center;width: 100%;}

/* 스크롤이벤트 발생 시 헤더가 하얀배경으로 바뀔 때 적용할 스타일 */
#header.active {background: #fff;box-shadow: rgba(146, 146, 146, 0.322) 0 0 20px;}
#header.active .hd_wrap h1 a {color: #212121;background-position: 10px -73px;}
#header.active .gnb .btn_gnb.gnb_open {background-position: 3px -200px;}



/* footer */
#footer {background: #333; color: #fff;}
.ft_wrap {position: relative; padding: 50px 10px; line-height: 1.6; font-size: 16px;}
.foot address {font-style: normal;}
.foot p strong {font-weight: 600; margin-right: 10px;}
.foot .copy {font-size: 14px; font-weight: 200;}
.btn_top {position: absolute;display: block;bottom: 10px;right: 10px;width: 50px;height: 50px;border-radius: 10px;padding: 20px 0 0 0;background: #008349 url('/images/jbsports/common/icon.png') no-repeat 11px -518px;color: #fff;font-size: 17px;font-weight: 400;text-align: center;}
.btn_top:hover, .btn_top:active, .btn_top:focus {transform: translateY(-7px);}


/* 서브 레이아웃 */
.sub_container {padding-top: 70px;}
.s_top {padding: 65px 0;}
.s_top.sub_visual1 {background: url('/images/jbsports/contents/sub/sub_bg1.png') no-repeat center;}
.s_top.sub_visual2 {background: url('/images/jbsports/contents/sub/sub_bg2.png') no-repeat center;}
.s_top.sub_visual3 {background: url('/images/jbsports/contents/sub/sub_bg3.png') no-repeat center;}
.s_top.sub_visual4 {background: url('/images/jbsports/contents/sub/sub_bg4.png') no-repeat center;}
.s_top.sub_visual5 {background: url('/images/jbsports/contents/sub/sub_bg5.png') no-repeat center;}
.s_top .sub_tit h2 {margin: 0 0 40px 0;color: #fff;font-family: 'GongGothic';font-weight: 600;font-size: 26px;text-align: center;}
.top_menu {border-radius: 50px;box-shadow: 0 0 50px rgba(0, 0, 0, 0.439);}
.top_menu>div {display: flex;justify-content: space-between;position: relative;padding: 0 15px;background: rgba(255, 255, 255, 0.078);backdrop-filter: blur(11px);border-radius: 50px;box-shadow: inset 0 0 4px rgba(255, 255, 255, 0.2);border: 1px solid rgba(255, 255, 255, 0.251);}
.top_menu .l_gnb {display: flex;}
.top_menu .l_gnb>li>a {display: block;position: relative;width: 35px;height: 50px;color: #fff;margin-right: 8px;}
.top_menu .l_gnb>li>a span {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 35px;height: 35px;font-size: 0;background: url('/images/jbsports/common/l_gnb.png') no-repeat 6px -146px / 80px;}
.top_menu .l_gnb>li button {position: relative;width: 110px;line-height: 50px;color: #f4f4f4;padding: 0 25px 0 15px;text-align: left;font-size: 15px;background: transparent;}
.top_menu .l_gnb>li button span{position: absolute;top: 50%;right: 0;transform: translateY(-50%);width: 30px;height: 30px;font-size: 0;background: url('/images/jbsports/common/l_gnb.png') no-repeat 7px 9px / 70px;}
.top_menu .l_gnb>li button:before {display: block;position: absolute;top: 50%;left: 0;transform: translateY(-50%);width:1px;height: 15px;background: rgba(244, 244, 244, 0.49);content:'';z-index: -1;}
.top_menu .l_gnb>li:last-child button:after {display: block;position: absolute;top: 50%;right: -5px;transform: translateY(-50%);width:1px;height: 12px;background: rgba(244, 244, 244, 0.49);content:'';}
.r_menu {display: flex;position: absolute;top: 76px;left: 50%;transform: translateX(-50%);gap: 8px;}
.r_menu>li>a {display: block;width: 35px;height: 35px;background: rgba(244, 244, 244, 0.98) url('/images/jbsports/common/l_gnb.png') no-repeat -50px -100px / 76px;border-radius: 50%;border: 1px solid rgba(70, 70, 70, 0.788);transition: none;}
.r_menu>li>a span {position: absolute; top: -10000px;}
.r_menu .print a {background-position: -48px -58px;}

.top_menu .l_gnb>li div {display: none;}
.top_menu .l_gnb>li.on div {display: block;}
.r_menu .share div {display: none;}
.r_menu .share.on div {display: block;}

/* l_gnb 드롭메뉴 스타일 */
.top_menu .l_gnb>li {position: relative;}
.top_menu .l_gnb>li.on button {background: #fff;border-radius: 25px 25px 0 0;color: #444;font-weight: 500;}
.top_menu .l_gnb>li.on button span {background-position: -46px -22px;}
.top_menu .l_gnb li div{position: absolute;top: 50px;left: 0;width:100%;background: #008349;padding: 10px;border-radius: 0 0 25px 25px;box-shadow: 0 0 30px rgba(0, 0, 0, 0.11);}
.top_menu .l_gnb li div li a {display: inline-block;font-size: 15px;line-height: 2;color: #f4f4f4;position: relative;}
.top_menu .l_gnb li div li a:hover,
.top_menu .l_gnb li div li a:active,
.top_menu .l_gnb li div li a:focus {text-decoration: underline;}

/* share 드롭 */
.r_menu .share {position: relative;}
.r_menu .share div {position: absolute;top: 35px;left: 0;z-index: 9999;text-align: center;}
.r_menu .share div a {display: block; width: 35px; height: 35px; border-radius: 50%; }
.r_menu .share div .insta a {background: url('/images/jbsports/contents/sub/l_gnb_insta.png') no-repeat center / cover;}
.r_menu .share div .face a {background: url('/images/jbsports/contents/sub/l_gnb_face.png') no-repeat center / cover;}
.r_menu .share div .kakao a {background: url('/images/jbsports/contents/sub/l_gnb_kakao.png') no-repeat center / cover;}
.r_menu .share div .x_twi a {background: url('/upload_data/board_data/BBS_0000160/176967585549495.png') no-repeat center / cover;}
.r_menu .share div .url a {width: 34px;height: 34px;margin: 0 auto;background: #ebecec url('/images/jbsports/common/l_gnb.png') no-repeat -44px -193px / 75px;}
.r_menu .share div .close {width: 33px;height: 33px;margin-top: 3px;border-radius: 50%;background: #333 url('/images/jbsports/common/l_gnb.png') no-repeat 6px -238px / 75px;}
.r_menu .share div span {position: absolute; top: -100000px;}

.sub_title {width: 95%;margin: 20px auto;}
.sub_title h3 {font-size: 36px;font-family: 'GongGothic', 'san-serif';font-weight: 600;color: #212121;padding: 0 0 20px;border-bottom: 1px solid rgba(145, 180, 165, 0.259);margin-bottom: 40px;}


.s_con {background: transparent;width: 95%;margin: 0 auto 50px;}


/* tablet */
@media (min-width: 768px) {
  .hd_wrap h1 a{padding-left: 100px;background-position: 13px 10px;background-size:70px;font-size: 20px;}


  /* 스크롤이벤트 발생 시 헤더가 하얀배경으로 바뀔 때 적용할 스타일 */
  #header.active .hd_wrap h1 a{background-position: 10px -117px;}

  /* footer */
  .ft_wrap {display: flex; justify-content:space-between; align-items:center}
  .foot address {display: inline-block; margin-right: 50px;}
  .foot .call {display: inline-block;}
  .btn_top {position: static;}

  /* 서브레이아웃 */
  .s_top .sub_tit h2 {font-size: 30px;}
  .top_menu {width: 90%;margin: 0 auto;}
  .top_menu .l_gnb>li>a {width: 50px;height: 60px;/* margin: 0; */}
  .top_menu .l_gnb>li>a span {background-size: 85px;background-position: 6px -156px;}
  .top_menu .l_gnb>li button {width: 180px;padding: 0 35px 0 20px;line-height: 60px;font-size: 16px;font-weight: 400;}
  .top_menu .l_gnb>li button span {background-size: 80px;background-position: 6px 8px;right: 10px;}
  .top_menu .l_gnb>li.on button span {background-position: -54px -28px;}
  .r_menu {position: static;transform: none;gap: 0;margin-right: 10px;}
  .r_menu>li>a {background-color: transparent;border: none;margin: 12px 0;background-size: auto;}
  .r_menu .share a {background-position: 4px -136px;}
  .r_menu .print a {background-position: 4px -81px;}

  /* l_gnb 드롭메뉴 스타일 */
  .top_menu .l_gnb li div {top: 60px; padding: 15px 25px;}
  .top_menu .l_gnb li div li a {font-size: 18px;line-height: 2.3;}

  .r_menu .share.on a {background: #eee url('/images/jbsports/common/l_gnb.png') no-repeat -49px -99px / 76px;}
  .r_menu .share div {top: 50px;}
}


/* desktop*/
@media all and (min-width: 1200px) {
  #header::after {top: 90px;}
  .hd_wrap {height: 90px;}
  .hd_wrap h1 a{padding-left: 110px;background-size:auto;line-height: 90px;}
  
  .gnb {width: 63%;}
  .gnb .gnb_wrap {display: flex;position: static;justify-content: space-between;background: transparent;padding: 0;}
  .gnb .gnb_wrap .menu_box {width: 64%;}
  .gnb .btn_gnb {display: none;}

  .gnb_wrap .menu_box>ul {display: flex;}
  .gnb_wrap .menu_box .depth1>a {border: none;height: 90px;line-height: 90px;color: #fff; border-radius: 0;}
  .gnb_wrap .menu_box .depth1>a:hover,
  .gnb_wrap .menu_box .depth1>a:active,
  .gnb_wrap .menu_box .depth1>a:focus {background: none; text-decoration: underline; color: #008349;font-weight: 600;}
  .gnb_wrap .menu_box .depth1>a:after{display: none;}


  .gnb_wrap .btn_paragame {display: none;}

  /* pc 드롭메뉴 스타일 */
  .gnb_wrap .menu_box .depth2 {display: none;}
  .gnb_wrap .menu_box.select .depth2 {display: block;padding: 10px;height: 92.1%;border-radius: 0;}

  .gnb_wrap .menu_box .depth2 {background: #fff;}
  .gnb_wrap .menu_box .depth2 a {position: relative;font-size: 16px;color: #444;line-height: 45px;}
  .gnb_wrap .menu_box.select::before {display: block;position: absolute;top: 90px;left: 0;z-index: -1;width: 100%;height: 309px;background: url('/upload_data/board_data/BBS_0000160/177319460378241.png') no-repeat 0;content: '';}
  
  /* 새창열림스타일 */
  .menu_box .new_win {position: absolute;top: -5px;right: -22px;}
  .l_gnb .new_win {top: 6px;}
  
  .gnb_wrap .util {position: static;width: 34%;}
  .gnb_wrap .util ul {justify-content: space-between;}
  .gnb_wrap .util ul li a{height: 90px;line-height: 90px;color: #dfdfdf;font-weight: 400;padding: 0 0 0 25px;}
  .gnb_wrap .util ul li a::before {top: 32px;left: 0;}
  .gnb_wrap .util ul .g_login a::before {background-position: 4px 4px;} 
  .gnb_wrap .util ul .jinan_home a::before {background-position: 4px -77px;} 
  .gnb_wrap .util ul .g_sitemap a::before {background-position: 4px -160px;} 


  /* 스크롤이벤트 발생 시 헤더가 하얀배경으로 바뀔 때 적용할 스타일 */
  #header.active .hd_wrap h1 a {background-position: 5px -147px;}
  #header.active .gnb_wrap .menu_box .depth1>a {color: #212121;font-weight: 600;}
  #header.active .gnb_wrap .util ul li a{color: #696969;}
  #header.active .gnb_wrap .util ul .g_login a::before {background-position: 4px -37px;} 
  #header.active .gnb_wrap .util ul .jinan_home a::before {background-position: 4px -120px;} 
  #header.active .gnb_wrap .util ul .g_sitemap a::before {background-position: 4px -199px;} 
  #header.active .gnb_wrap .menu_box .depth1>a:hover,
  #header.active .gnb_wrap .menu_box .depth1>a:active,
  #header.active .gnb_wrap .menu_box .depth1>a:focus {color: #008349;}

  #header:hover {background-color: #fff;}
  #header:hover .hd_wrap h1 a {background-position: 5px -147px;color: #212121;}
  #header:hover .gnb_wrap .menu_box .depth1>a {color: #212121;font-weight: 600;}
  #header:hover .gnb_wrap .util ul li a{color: #696969;}
  #header:hover .gnb_wrap .util ul .g_login a::before {background-position: 4px -37px;} 
  #header:hover .gnb_wrap .util ul .jinan_home a::before {background-position: 4px -120px;} 
  #header:hover .gnb_wrap .util ul .g_sitemap a::before {background-position: 4px -199px;} 
  #header:hover .gnb_wrap .menu_box .depth1>a:hover,
  #header:hover .gnb_wrap .menu_box .depth1>a:active,
  #header:hover .gnb_wrap .menu_box .depth1>a:focus {color: #008349;}
  
  /* 디데이 */
  .d_day {top: 88px;width: 110px; height: 90px; background-size: 110px;}
  .d_day p {font-size: 24px;line-height: 80px;}

  /* 서브레이아웃 */
  .sub_container {padding-top: 90px;}
  .s_top {padding: 60px 0 0 0;background-size: cover;height: 450px;}
  .s_top.sub_visual1 {background-size: 100%;}
  .s_top.sub_visual2 {background-size: 100%;}
  .s_top.sub_visual3 {background-size: 100%;}
  .s_top.sub_visual4 {background-size: 100%;}
  .s_top.sub_visual5 {background-size: 100%;}
  .s_top .sub_tit h2 {font-size: 38px;}
  
  .top_menu {width: 1023px;}
  .top_menu .l_gnb>li>a {width: 80px;height: 70px;}
  .top_menu .l_gnb>li>a span {background-size: 97px;background-position: 4px -180px;}
  .top_menu .l_gnb>li button {width: 260px;line-height: 70px;font-size:20px;padding: 0 35px 0 25px;}
  .top_menu .l_gnb>li button span {right: 15px;}
  .top_menu .l_gnb>li.on button span {background-position: -54px -28px;}
  .r_menu {margin-right: 25px; gap: 5px;}
  .r_menu>li>a {width: 45px;height: 45px;}
  .r_menu .share a {background-position: 9px -130px;}
  .r_menu .print a {background-position: 8px -76px;}
  .s_con {width: 1023px;margin-top: -115px;}
  /* l_gnb 드롭메뉴 스타일 */
  .top_menu .l_gnb li div {top: 70px;}
  /* share 드롭 */
  .r_menu .share.on a {background-position: -44px -94px;background: transparent;}
  .r_menu .share div {top: 8px;left: -155px;background: rgba(248, 248, 248, 0.729);border-radius: 29px;padding: 5px 10px;}
  .r_menu .share.on div {display: flex;gap: 4px;}
  .r_menu .share div ul {display: flex;}
  .r_menu .share div a {width: 45px; height: 45px;}
  .r_menu .share div .url a {width: 43px;height: 43px;background-position: -41px -189px;border: 1px solid #a1a1a1;}
  .r_menu .share div .close {width: 43px;height: 43px;background-position: 11px -233px;margin: 0;}

  .sub_title {width: 1023px; margin: -90px auto 0;}
  .s_con {width: 1023px;margin: 0 auto 60px;}
}

/* 와이드 desktop*/
@media all and (min-width: 1620px) {
  .hd_wrap {width: 1620px;margin: 0 auto;padding: 0;}
  .hd_wrap h1 a {background-position: 0px 7px;font-size: 26px;}

  .gnb .gnb_wrap {gap: 20px;}
  .gnb_wrap .menu_box>ul li {width: 130px;}
  .gnb_wrap .menu_box .depth1>a {font-size: 22px;}
  .gnb_wrap .menu_box .depth2 a {font-size: 18px;}
  .gnb_wrap .util {width: 30%;}
  .gnb_wrap .util ul {gap: 10px;}
  .gnb_wrap .util ul li a {font-size: 19px;padding: 0 0 0 30px;}

  .ft_wrap {width: 1620px;margin: 0 auto;padding: 70px 0;font-size: 18px;}
  .foot address {margin-right: 100px;}

 
  
  /* 서브레이아웃 */
  .s_top {padding: 70px 0 0 0;}
  .s_top .sub_tit h2 {margin: 0 0 80px 0;}
  .top_menu {width: 1500px;}
  .sub_title {width: 1500px;margin: -40px auto 0;}
  .s_con {width: 1500px;}
}     

@media all and (min-width: 1720px) {
  .hd_wrap, .ft_wrap {width: 1720px;}

  /* 디데이 */
  .d_day {right: 90px;}
  .d_day p {font-size: 24px;line-height: 80px;}
}