/*#fullpage .section {min-height: 920px;} #fullpage .fp-auto-height.fp-section, #fullpage .fp-auto-height .fp-slide, #fullpage .fp-auto-height .fp-tableCell {min-height: auto;}*/ #Wrap {} #wait {text-align:center} #wait img {max-width: 100%;} /**/ #skipBtnWrap a {display: block;width: 1px;height: 0;line-height: 0;text-align: center;background: #333;color: #fff;} #skipBtnWrap a:focus, #skipBtnWrap a:hover, #skipBtnWrap a:active {width: 100%;height: 30px;line-height: 30px;} /**/ #poplayer{position:absolute;z-index:99999;top:120px;left:50%;margin:0 0 0 -280px;width:560px;height:595px;} #poplayer *{margin:0;padding:0;border:0} #poplayer img{display:block} #poplayer .todays{padding:2px 20px 8px 20px;text-align:right;background:#323232} #poplayer .todays a{font-size:14px;color:#fff} #poplayer area{cursor:pointer} /**/ #popupbar{position:relative;background:#0e6faf url(../_img/popupbarbg.png) no-repeat 50% 50%;overflow:hidden;display:none} #popupbar .popupbar{max-height:117px !important;overflow:hidden} #popupbar .popupbar .slide h3{display:inline-block;margin:0;padding:0 20px 5px 0;font-size:26px;color:#fff;text-shadow:-1px -1px 2px rgba(0,0,0,0.2)} #popupbar .popupbar .slide .close{display:inline-block} #popupbar .popupbar .slide .close button{font-size:14px;font-weight:800;letter-spacing:-1px;color:#fff;border:0;background:none} #popupbar .popupbar img{display:block} #popupbar .bx-controls{position:absolute;z-index:100;bottom:3px;left:50%} #popupbar .bx-pager{float:left;display:block} #popupbar .bx-pager .bx-pager-item{display:inline;} #popupbar .bx-pager.bx-default-pager a{display:inline-block;margin-right:5px;width:12px;height:12px;border:2px solid #fff;background:transparent;border-radius:50px;text-indent:-9999px} #popupbar .bx-pager.bx-default-pager a.active{border:2px solid #00558b;background:#00558b} #popupbar .bx-prev{position:absolute;top:0px;right:80px;display:none;width:10px;height:19px;text-indent:-9999px;background:url(../_img/banner_prev.png) no-repeat} #popupbar .bx-next{position:absolute;top:0px;right:20px;display:none;width:10px;height:19px;text-indent:-9999px;background:url(../_img/banner_next.png) no-repeat} #popupbar i.b1{position:absolute;z-index:3;top:0px;left:0%;display:block;width:100%;height:5px;background:#00558b} #popupbar i.b2{position:absolute;z-index:4;top:0px;left:50%;margin:0 0 0 570px;display:block;width:100%;height:5px;background:#ffbd3f} #popupbar .holidays{padding-top:40px;text-align:center} #popupbar .opens{text-align:center} #popupbar .opens a{display:block;text-align:center} #popupbar .opens a img{display:block;margin:0 auto} #layerPopup { position: absolute; top: 50px; left: 50px; z-index: 59999; background-color: #fff; border: 2px solid #ddd; } #layerPopup .popup_bottom { padding: 7px 15px; text-align: right; } #layerPopup .popup_bottom .pop_close { display: inline-block; padding: 7px 10px; background-color: #1f2a69; font-size: 14px; color: #fff; } #layerPopup1 { position: absolute; top: 50px; left: 450px; z-index: 59999; background-color: #fff; border: 2px solid #ddd; } #layerPopup1 .popup_bottom { padding: 7px 15px; text-align: right; } #layerPopup1 .popup_bottom .pop_close1 { display: inline-block; padding: 7px 10px; background-color: #1f2a69; font-size: 14px; color: #fff; } /* 1400 - all */ @media all and (min-width: 1400px) { #divpop { display:none;} #mm-blocker{display:none} #popupWindow{position:absolute} #OpenLayer {position: absolute;top: 150px;left: 100px;z-index: 9999;background: #fff;padding: 10px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 14px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} /* header */ #header {overflow: hidden;position:absolute;top: 0;left: 50%;z-index:30002;width:100%;max-width: 2000px;height: 150px;padding: 0 3.2%;transform: translateX(-50%);} #header.sel {overflow: hidden;height: 300px;box-sizing: border-box;background: #fff;border-bottom: 1px solid #ccc;} /*#header.header_active {background-color: #fff;border-width: 0 0 5px 0;border-style: solid;border-image: linear-gradient(to right, #00a54c 0%, #4e0080 100%);border-image-slice: 1;border-image-width: 0 0 5px 0;border-top: 0;} #header .header {position: relative;height: 110px;padding: 0 17%;} #header .header::after {content: '';display: block;clear: both;}*/ #header .header {display: flex;justify-content: space-between;} #header h1 {/*position: absolute;top: 0;left: 0;*/flex: 0 0 350px;} #header h1 a {display: block;width: 100%;height: 150px;background-image: url(../_img/logo.png);background-repeat: no-repeat;background-position: 0 50%;background-size: 95% auto;text-indent: -9999px;} /*#header.header_active h1 a, #header.bg_white h1 a {background-image: url(../_img/logo_on.png);}*/ :is(#header.header_active, #header.bg_white) h1 a {background-image: url(../_img/logo_on.png?v=1);} #header button.btn-menu {display:none} #header.bg_white {background-color: #fff;border-bottom: 1px solid #d9d9d9;} /**/ nav.menu_wrap {} #gnb {} #gnb .gnb {} #gnb .depth1 {height: 150px;text-align: center;font-size: 0;} #gnb .depth1 > li {position: relative;display: inline-block;height: 300px;vertical-align: top;} #gnb .depth1 > li:hover {background-color: #e9f8f3;} #gnb .depth1 > li > a {display:block;height: 150px;margin: 0;padding: 0 20px;line-height: 150px;font-size: 20px;font-weight: 500;color: #000;} #header.header_active #gnb .depth1 > li > a, #header.bg_white #gnb .depth1 > li > a {color: #333;} #gnb .depth1 > li > a em{position:absolute;top:23px;right:0;display:block;margin:-10px 0 0 0;width:1px;height:16px;background:#ccc;display:none} #header #gnb .depth1 > li.sel > a {color: #00d863;font-weight: 500;text-decoration: underline;} #header.header_active #gnb .depth1 > li.sel > a, #header.bg_white #gnb .depth1 > li.sel > a {color: #3e53d1;font-weight: 500;text-decoration: underline;} #header #gnb .depth1 > li:hover > a, #header #gnb .depth1 > li > a:hover {color: #138b4f;} /* #gnb .depth2 {display: none;overflow:hidden;position:absolute;top: 110px;left: 0;z-index: 10;width: 100%;padding:0px 23% 40px 23%;box-sizing: border-box;text-align:center;} #gnb .depth2 > li {float: left;width: 32%;margin: 0 1%;} #gnb .depth2 > li:nth-child(3n-2) {margin-left: 0;} #gnb .depth2 > li:nth-child(3n) {margin-right: 0;} #gnb .depth2 > li a{display:block;height: 58px;padding: 0 15px;font-size: 16px;line-height: 58px;font-weight: 500;color:#333;border-bottom: 1px solid #ddd;text-align: left;} #gnb .depth2 > li a:hover{background: #4e0080;color: #fff;border-bottom: 0;} */ #gnb .depth2{position:absolute;top:140px;width: 100%;left: 0;padding-bottom: 50px;} #header.sel #gnb .depth2 {display:block;top: 120px;transition: all 0.6s cubic-bezier(0.785, 0.135, 0.150, 0.860);} #gnb .depth2 li a{display:block;letter-spacing:-0.4px;padding: 10px;font-size:15px;color:#000;word-break: keep-all;} #gnb .depth2 li a:hover{color:#3e53d1;text-decoration: underline;} #gnb .depth2 li.sel a{color:#da204c;} #gnb .depth1 > li > a::after {content: "";position:absolute;bottom: 0;left: 0;display:none;width: 100%;height: 5px;background: #558fff;} #gnb .nav_bg {display:none;position:absolute;top: 110px;left: 0;width: 100%;height: 400px;background: #f5f5f5;} #header .etc_wp {/*position: absolute;top: 0;right: 0;*/max-width: 330px;text-align: left;font-size: 0;vertical-align: top;} #header .etc_btn > ul {display: inline-block;vertical-align: middle;} #header .etc_btn > ul > li {display: inline-block;} #header .etc_btn > ul > li > a {display: block;padding: 0 7px;vertical-align: middle;font-size: 16px;font-weight: 500;line-height: 150px;color: #000;} #header.header_active .etc_btn > ul > li > a, #header.bg_white .etc_btn > ul > li > a {color: #333;} #header .etc_btn > a.cj_county {position: relative;z-index: 0;display: inline-block;padding-left: 12px;margin-left: 7px;vertical-align: middle;font-size: 15px;color: #fff;} #header.header_active .etc_btn > a.cj_county, #header.bg_white .etc_btn > a.cj_county {color: #333;} #header .etc_btn > a.cj_county::before {content: '';position: absolute;top: 50%;left: 0;width: 1px;height: 11px;margin-top: -5.5px;background-color: #fff;line-height: 110px;} #header.header_active .etc_btn > a.cj_county::before, #header.bg_white .etc_btn > a.cj_county::before {background-color: #d9d9d9;} /*#header .etc_wp button.search {display: inline-block;width: 24px;height: 110px;padding: 0 13px;text-indent: -9999px;background: url(../_img/ico_search.png) no-repeat 50%;vertical-align: middle;box-sizing: content-box;} #header .etc_wp a.sitemap {display: inline-block;width: 30px;height: 110px;padding: 0 0 0 10px;text-indent: -9999px;background: url(../_img/ico_menu.png) no-repeat 100% 50%;vertical-align: middle;}*/ #header.fix_menu {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.fix_menu #gnb .depth1 > li > a {color:#333;} #header.fix_menu #gnb .depth1 > li.sel > a {color:#558fff} /*#topSearchWp {position: absolute;top: -200px;left: 0;width: 100%;z-index: 30003;background: #eee;} #topSearchWp form {position: relative;max-width: 1560px;margin: 0 auto;padding: 40px 0 50px;text-align: center;} #topSearchWp label {display: block;margin-bottom: 10px;font-size: 32px;font-weight: 500;color: #333;} #topSearchWp #topSearch {width: 500px;height: 40px;line-height: 40px;padding: 0 12px;font-size: 15px;font-family: 'Lato', 'Noto Sans KR';border: 0;color: #333;font-weight: 300;vertical-align: middle;border: 1px solid #ddd;} #topSearchWp .btn_search {width: 120px;height: 40px;line-height: 40px;margin-left: 3px;font-family: 'Lato', 'Noto Sans KR';font-size: 15px;color: #fff;background: #0e4fa3;vertical-align: middle;} #topSearchWp .close {position: absolute;top: 25px;right: 0;width: 29px;height: 29px;text-indent: -9999px;background: url(../_img/ico_close.png) no-repeat 50%;}*/ #allbg{position:fixed;z-index:30000;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.35);display:none} /* #menu{position:absolute;z-index:10;top:0;right:0;background: #252525;} #menu a{display:block;width: 50px;height: 50px;background:url(../_img/menu.png) no-repeat 50%;text-indent:-9999em;overflow:hidden} */ /**/ #mainCon {width: 100%;padding-bottom: 100px;} #mainCon section .section_inner {max-width: 1320px;margin: 0 auto;} #mainCon section .section_inner h3 {font-size: 26px;font-weight: 700;color: #000;} #mainCon section .section_inner h3.white {color: #fff;} #mainCon section .section_inner .sub_tit { font-size: 16px; color: #3f3f3f; position: relative; padding: 0 0 3px 25px;} /* 메인비주얼 */ #visual {padding-top: 150px;background-color: #f0faf7;background-image: url(../_img/bg_visual.png);background-repeat: no-repeat;background-position: 100% 100%;background-size: contain;} #visual .m_visual {position: relative;display: flex;justify-content: space-between;} #visual .m_visual::before {content: '';position: absolute;bottom: -46px;right: 0;width: 50%;height: 290px;background-image: url(../_img/ico_m_visual.png?v=2);background-repeat: no-repeat;background-position: calc(100% - 0px) 67%;background-size: 100%;} #visual .m_visual::after {content: '';position: absolute;bottom: -45px;right: 45%;width: 23%;height: 160px;/*background-image: url(../_img/ico_m_visual2.png);background-repeat: no-repeat;background-position: 0 100%;*/} #visual .m_visual .v_img {flex: 0 0 740px;padding-bottom: 100px;} #visual .m_visual .v_img a {display: block;line-height: 1;} #visual .m_visual .v_img .btn_pick {line-height: 45px;width: 343px;padding: 5px;height: 60px;font-size: 25px;font-weight: 500;text-align: center;color: #6d6d6d;background-color: #fff;border-radius: 35px;} #visual .m_visual .v_img .pop {max-width: 730px;min-height: 410px;padding: 40px;color: #fff;border-radius:30px;background-color: var(--mainPop);background-repeat: no-repeat;background-image: url(../_img/main_pop_book2.png);background-position: 100% 100%;background-size: 30%;} #visual .m_visual .v_img .pop .btn {margin-top:20px;} #visual .m_visual .v_img .tit {padding: 0px;color: #fff;font-size: 36px;font-weight: 700;background-color: var(--mainPop);} #visual .m_visual .v_img .day {margin: 10px 0px;color: #fff;font-size: 19px;background-color: var(--mainPop);letter-spacing: -1px;} #visual .m_visual .v_img .day span:first-child{border-right:1px solid #ccc;padding: 0 10px 0 0;} #visual .m_visual .v_img .p9872 {font-size:30px;margin-right:10px;} #visual .m_visual .v_img .dc_seq {font-size:14px;} #visual .m_visual .v_img .course_list {display: flex;flex-wrap: wrap;} #visual .m_visual .v_img .course_list > li {overflow: hidden;width: calc(50% - 20px);font-size: 20px;margin: 0px;border-radius: 10px;text-align: left;background-repeat: no-repeat;} /* #visual .m_visual .v_img .course_list > li:first-child {background-image: url(../_img/ico_select_person1.png);background-position: calc(100% - 10px) 100%;background-size: auto 225px;} #visual .m_visual .v_img .course_list > li:last-child {background-image: url(../_img/ico_select_person2.png);background-position: calc(100% - 20px) 100%;background-size: auto 180px;} */ #visual .m_visual .v_img .course_list > li:nth-child(-n+2) {margin-top: 0;} #visual .m_visual .v_img .course_list > li:nth-child(2n-1) {margin-left: 0;} #visual .m_visual .v_img .course_list > li:nth-child(2n) {margin-right: 0;} #visual .m_visual .v_guide {flex: 0 1 460px;margin-top: 80px;background-image: url(../_img/bg_m_ticket.png);background-repeat: repeat-y;background-position: 50% 0;} #visual .m_visual .v_guide > div {padding: 15px 35px 25px;background-image: url(../_img/shape_m_ticket.png);background-repeat: no-repeat;background-position: 100% 0;} #visual .m_visual .v_guide .v_date {display: flex;align-items: flex-end;} #visual .m_visual .v_guide .v_date > span {font-size: 18px;font-weight: 500;color: #000;line-height: 1.2em;} #visual .m_visual .v_guide .v_date > span.date {margin-left: 20px;font-size: 55px;font-weight: 500;color: #dc4649;line-height: 0.9em;} #visual .m_visual .v_guide .v_txt {display: table;width: 100%;margin-top: 20px;} #visual .m_visual .v_guide .v_txt > div {display: table-cell;} #visual .m_visual .v_guide .v_txt > div div.end {margin-top: 2px;} #visual .m_visual .v_guide .v_txt > div span {display: inline-block;font-size: 16px;font-weight: 500;} #visual .m_visual .v_guide .v_txt > div.receipt span {color: #3e53d1;} #visual .m_visual .v_guide .v_txt > div.race span {color: #e0474b;} #visual .m_visual .v_guide .v_txt > div span.tit {padding: 8px 20px;margin-right: 5px;border-radius: 50px;font-size: 15px;color: #fff;} #visual .m_visual .v_guide .v_txt > div.receipt span.tit {background-color: #3e53d1;} #visual .m_visual .v_guide .v_txt > div.race span.tit {background-color: #e0474b;} /* #section1 */ #section1 {padding: 90px 0 50px;background-color: #eee;} #section1 .m_direct {margin-bottom: 90px;} #section1 .m_direct > ul {display: flex;justify-content: space-between;} #section1 .m_direct > ul > li {width: 18.181818%;text-align: center;} #section1 .m_direct > ul > li > a {display: block;padding: 25px 30px;font-size: 21px;font-weight: 700;background-color: #fff;color: #420d64;border-radius: 15px;box-shadow: 10px 10px 30px rgba(0,0,0,0.07);} /*#section1 .m_direct > ul > li.direct1 > a {background-color: #3e53d1;} #section1 .m_direct > ul > li.direct2 > a {background-color: #dc4649;} #section1 .m_direct > ul > li.direct3 > a {background-color: #7e8ef0;} #section1 .m_direct > ul > li.direct4 > a {background-color: #3e53d1;} #section1 .m_direct > ul > li.direct5 > a {background-color: #47aa8b;}*/ #section1 .m_direct > ul > li > a::before {content: '';display: block;height: 55px;margin-bottom: 15px;background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 100%;} #section1 .m_direct > ul > li.direct1 > a::before {background-image: url(../_img/ico_m_direct1.png?v=1);} #section1 .m_direct > ul > li.direct2 > a::before {background-image: url(../_img/ico_m_direct2.png?v=1);} #section1 .m_direct > ul > li.direct3 > a::before {background-image: url(../_img/ico_m_direct3.png?v=1);} #section1 .m_direct > ul > li.direct4 > a::before {background-image: url(../_img/ico_m_direct4.png?v=1);} #section1 .m_direct > ul > li.direct5 > a::before {background-image: url(../_img/ico_m_direct5.png?v=1);} #section1 .my_race {display: flex;} #section1 .my_race .title_wp {flex: 0 0 200px;position: relative;} #section1 .my_race .title_wp::after {content: '';position: absolute;bottom: -65px;left: -15px;width: 220px;height: 185px;background-image: url(../_img/ico_m_my_title.png);background-repeat: no-repeat;background-position: 0 100%;background-size: auto 100%;} #section1 .my_race .track_wp {position: relative;width: calc(100% - 200px);padding: 130px 45px 80px 100px;background-image: url(../_img/ico_m_my_track.png);background-repeat: no-repeat;background-position: 50% 88px;} #section1 .my_race .track_wp .start, #section1 .my_race .track_wp .finish {position: absolute;background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999px;} #section1 .my_race .track_wp .start {top: 35px;left: 0;width: 180px;height: 105px;background-image: url(../_img/ico_m_my_start.png);background-size: auto 100%;} #section1 .my_race .track_wp .finish {top: 0;right: -25px;width: 120px;height: 120px;background-image: url(../_img/ico_m_my_finish.png?v=2);background-size: auto 100%;} #section1 .my_race .track_wp .finish.end {display: none;} #section1 .my_race .track_wp .track {position: relative;z-index: 10;width: 100%;height: 11px;border-radius: 6px;background-color: #acaaeb;} #section1 .my_race .track_wp .track::before {content: '';} #section1 .my_race .track_wp .track > span {position: absolute;display: inline-block;padding-top: 25px;text-align: center;font-size: 13px;font-weight: 700;color: #000;line-height: 1.2em;transform: translateX(-50%);} #section1 .my_race .track_wp .track > span::before {content: '';position: absolute;top: -1px;left: 50%;z-index: 2;width: 13px;height: 13px;margin-left: -6px;background-color: #fff;border-radius: 50%;} #section1 .my_race .track_wp .track > span.step0 {color: rgba(0,0,0,0.4);} #section1 .my_race .track_wp .track > span.step0::after {content: '';position: absolute;top: 0;left: 0;z-index: 1;width: 15px;height: 12px;background-color: #eee;} #section1 .my_race .track_wp .track > span.me {position: absolute;z-index: 5;display: inline-block;padding: 25px 0 50px;text-align: center;font-size: 15px;font-weight: 700;color: #fff;line-height: 1.2em;transform: translateX(-50%);} #section1 .my_race .track_wp .track > span.me::before {content: '';position: absolute;top: -1px;left: 50%;z-index: 2;width: 13px;height: 13px;margin-left: -6px;background-color: #fff;border-radius: 50%;} #section1 .my_race .track_wp .track > span.me::after {content: '';position: absolute;top: -100%;left: 50%;z-index: 9;width: 90px;height: 85px;/*background-image: url(../_img/ico_man_run.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-90%);background-size: auto 100%;*/} #section1 .my_race .track_wp .track > span.me.end::after {top: -165px;height: 160px;background-image: url(../_img/ico_man_finish.png);} /* #section2 */ #section2 .section_inner {display: flex;justify-content: space-between;flex-wrap: wrap;padding: 100px 0;} #section2 h3 {position: relative;margin-bottom: 35px;} #section2 h3 a.more {position: absolute;top: 10px;right: 0;width: 20px;height: 20px;background-image: url(../_img/ico_m_more.png);background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999em;} #section2 .section_inner > div {width: 32.5757%;} #section2 .section_inner > div.notice_wp {width: 21.2121%;} #section2 .graph_wp .graph {height: calc(100% - 50px);} #section2 .graph_wp .graph > div {display: flex;width: 100%;height: 33.33333%;align-items: center;justify-content: space-between;} #section2 .graph_wp .graph > div > span {vertical-align: middle;} #section2 .graph_wp .graph > div > span.tit {width: 23%;font-size: 17px;font-weight: 700;} #section2 .graph_wp .graph > div > span.con {position: relative;z-index: 0;width: 56%;height: 40px;text-align: left;} #section2 .graph_wp .graph > div > span.con > span {position: absolute;top: 0;left: 0;z-index: -1;min-width: 2px;max-width: 100%;height: 40px;background-color: #3db08b;} #section2 .graph_wp .graph > div > span.num {width: 21%;text-align: right;font-size: 14px;} #section2 .notice_wp .notice ul > li + li {margin-top: 20px;} #section2 .notice_wp .notice ul > li > a {overflow: hidden;display: block;text-overflow: ellipsis;white-space: nowrap;font-size: 16px;color: #000;} #section2 .notice_wp .notice ul > li > span.date {display: block;margin-top: 3px;font-size: 14px;color: #757575;} #section2 .section_inner .m_history {position: relative;width: 72%;margin: 100px 0 0;padding-right: 20px;} #section2 .section_inner .m_history::before {content: '';position: absolute;right: -10px;bottom: 0;width: 175px;height: 100%;background-image: url(../_img/ico_m_history.png);background-repeat: no-repeat;background-position: 100% 100%;} #section2 .section_inner .m_history > div {/*display: table;*/width: 100%;padding: 40px 225px 40px 50px;background-color: #f4f4f4;border-radius: 30px;} #section2 .section_inner .m_history > div h3, #section2 .section_inner .m_history > div .slider {display: table-cell;height: 80px;vertical-align: middle;} #section2 .section_inner .m_history > div h3 {width: 150px;padding-right: 50px;font-size: 28px;} #section2 .section_inner .m_history > div .slider .slick-list {overflow: hidden;} #section2 .section_inner .m_history > div .slider li {padding: 20px 0;} #section2 .section_inner .m_history > div .slider li span {display: inline-block;font-size: 16px;font-weight: 400;color: #000;vertical-align: middle;} #section2 .section_inner .m_history > div .slider li span.kind {width: 57px;height: 24px;margin-right: 10px;border-radius: 12px;text-align: center;background-color: #dc4649;color: #fff;font-size: 14px;font-weight: 500;line-height: 24px;text-transform: uppercase;} #section2 .section_inner .m_history > div .slider li span.con {max-width: calc(100% - 150px);} #section2 .section_inner .m_history > div .slider li span.date {margin-left: 10px;font-size: 14px;color: #757575;} #section2 .section_inner .m_qna {width: 21.2121%;margin: 100px 0 0;} #section2 .section_inner .m_qna > a {display: block;padding-right: 70px;background-image: url(../_img/ico_m_qna.png);background-repeat: no-repeat;background-position: 100% 0;} #section2 .section_inner .m_qna > a .tit {display: block;font-size: 26px;font-weight: 700;color: #000;line-height: 1.2em;} #section2 .section_inner .m_qna > a .btn {display: inline-block;height: 45px;margin-top: 20px;padding: 0 25px;font-size: 15px;font-weight: 500;color: #fff;background-color: #631992;line-height: 45px;border-radius: 45px;} /**/ #section3 h3 {margin-bottom: 15px;} #section3 .hall_wp {display: flex;justify-content: space-between;} #section3 .hall_wp > div {position: relative;width: 24%;padding: 25px 20px;margin-top: 35px;background-color: #eee9f2;border-radius:15px;text-align: center;} #section3 .hall_wp > div::before {content: '';position: absolute;top: -35px;left: 50%;width: 100%;height: 60px;background-image: url(../_img/ico_rank.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-50%);} #section3 .hall_wp p.title {margin-bottom: 15px;padding: 8px 0;background-color: #6da221;font-size: 18px;font-weight: 500;color: #fff;border-radius: 50px;} #section3 .hall_wp .list > li {font-size: 18px;font-weight: 500;color: #000;} #section3 .hall_wp .list > li + li {margin-top: 5px;} #section3 .hall_wp .list > li > span {display: inline-block;vertical-align: middle;} #section3 .hall_wp .list > li > span.num {margin: 0 10px 0 -10px;width: 26px;height: 26px;font-size: 14px;line-height: 26px;background-image: url(../_img/shape_rank_list.png);background-repeat: no-repeat;background-position: 50% 50%;} /**/ #footer {background-color: #333;} #footer .footer {display: flex;justify-content: space-between;max-width: 1320px;margin: 0 auto;padding: 50px 0;} #footer .f_left {max-width: 75%;} #footer .f_left .f_logo img {height: 35px;} #footer .f_left .f_link {margin: 20px 0;} #footer .f_left .f_link > a {font-size: 17px;color: #fff;font-weight: 400;} #footer .f_left .f_link > a.privacy {color: #daa0fe;} #footer .f_left .f_link > a + a {margin-left: 20px} #footer .f_left address {font-size: 16px;color: #fff;line-height: 1.5em;font-style: normal;} #footer .f_left address > span.addr {display: block;} #footer .f_left address > span strong {font-weight: 700;} #footer .f_left address .tel > span {display: inline-block;} #footer .f_left address .tel > span + span {margin-left: 20px;} #footer .f_left cite {display: block;margin-top: 25px;font-style: normal;font-size: 16px;color: #fff;} #footer .f_right {text-align: right;} #footer .f_right .go_top > button {width: 73px;height: 73px;border-radius: 30px;background-color: #34b574;background-image: url(../_img/ico_w_top_arrow.png);background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999px;} #footer .f_right .web_count {margin-top: 25px;} #footer .f_right .web_count > span {font-size: 16px;color: #000;} #footer .f_right .web_count > span + span {margin-left: 35px;} /**/ #contain {overflow: hidden;position: relative;width: 100%;} #contain .contain {max-width: 1440px;margin: 0 auto;} #contain .contain::after {content: '';display: block;clear: both;} /*#contain .contain {margin: 30px auto 0;max-width:1560px;overflow: hidden;position:relative;} #contain + #footer .contact {display:none;}*/ /* 서브비주얼 */ #contain #subVisual {width: 100%;height: 340px;padding-top: 150px;background-color: #f1f6ff;background-image: url(../_img/bg_visual.jpg?v=1);background-repeat: no-repeat;background-position: 50% 100%;background-size: cover;} /*#contain #subVisual .sub_visual .visual_wp {display: table;width: 100%;max-width: 1240px;height: 110px;margin: 70px auto 0;padding-left: 240px;} #contain #subVisual .sub_visual .visual_wp .visual {display: table-cell;vertical-align: middle;} #contain #subVisual .sub_visual .visual_wp .visual h2 {font-size: 30px;font-weight: 500;color: #fff;}*/ #contain #subVisual .sub_visual {position: relative;max-width: 1320px;height: 100%;margin: 0 auto;text-align: center;} #contain #subVisual .sub_visual h3 {padding-top: 10px;margin-bottom: 0;font-size: 34px;font-weight: 700;color: #000;} #contain #subVisual .sub_visual .locator {margin-top: 5px;} #contain #subVisual .sub_visual .locator > ul > li {display: inline-block;vertical-align: middle;} #contain #subVisual .sub_visual .locator > ul > li a, #contain #subVisual .sub_visual .locator > ul > li span, #contain #subVisual .sub_visual .locator > ul > li button {display: block;font-size: 16px;font-weight: 400;color: #000;font-family: inherit;background-color: transparent;} #contain #subVisual .sub_visual .locator > ul > li button::before, #contain #subVisual .sub_visual .locator > ul > li span::before {content: '>';display: inline-block;width: 20px;vertical-align: top;text-align: center;font-size: inherit;font-family: inherit;} #contain #subVisual .sub_visual .locator .navi {display: none;} #contain #subVisual .sub_visual::after {content: '';position: absolute;top: 88px;right: -14%;width: 923px;height: 526px; /*background-image: url(../_img/bg_sub_contents.png);*/background-repeat: no-repeat;background-position: 50% 50%;} #contain #subVisual .sub_visual::before {content: '';position: absolute;bottom: -15px;left: 0;width: 50%;height: 180px;background-image: url(../_img/ico_sub_visual.png);background-repeat: no-repeat;background-position: 0 100%; background-size: auto 100%;} #contain #subVisual .sub_visual .ticket_marathon {position: absolute;top: 0;right: 0;z-index: 1;width: 300px;height: 150px;padding: 20px 30px;background-image: url(../_img/shape_ticket.png);background-repeat: no-repeat;background-position: 0 50%;background-size: auto 100%;} #contain #subVisual .sub_visual .ticket_marathon > p {display: flex;text-align: left;align-items: flex-end;} #contain #subVisual .sub_visual .ticket_marathon > p span {font-size: 16px;font-weight: 500;color: #fff;} #contain #subVisual .sub_visual .ticket_marathon > p strong {margin-left: 10px;font-size: 50px;font-weight: 500;color: #ff5b5e;line-height: 1;} #contain #subVisual .sub_visual .ticket_marathon a.btn {display: block;width: 90%;margin-top: 15px;padding: 10px 20px;background-color: #38448a;font-size: 16px;font-weight: 500;color: #fff;background-image: url(../_img/ico_w_arrow.png);background-repeat: no-repeat;background-position: calc(100% - 20px) 50%;text-align: left;border-radius: 100px;} /**/ #container {max-width: 1320px;min-height: 500px;margin: 55px auto 120px;} #container::after {content: '';display: block;clear: both;} /**/ #aside {float: left;width: 250px;margin: 0 70px 0 0;} #aside h2 {padding-bottom: 45px;text-align: center;font-size: 24px;font-weight: 700;color: #1f2a69;border-bottom: 1px solid #e5e5e5;} #aside ul.left_menu > li {border-bottom:1px solid #e5e5e5;} #aside ul.left_menu > li > ul > li {border-bottom: 0;} #aside ul.left_menu > li > a {position: relative;z-index: 0;display:block;padding: 15px 20px;font-size: 17px;font-weight: 400;color:#000;transition:all 0.3s;} #aside ul.left_menu > li > a:hover {color: #1f2a69;font-weight: 400;transition: all 0.3s;} #aside ul.left_menu > li.sel > a::after {content: '';position: absolute;top: 50%;right: 20px;z-index: -1;width: 12px;height: 10px;margin-top: -5px;background-image: url(../_img/ico_w_arrow.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 10px;);background-size: auto 100%;} #aside ul.left_menu > li.sel > a, #aside ul.left_menu > li.sel > a:hover{color: #fff;border: 0;background-color: #1f2a69;transition:all 0.5s} #aside ul.left_menu > li ul {padding: 20px 25px;background:#f3f3f3; border-top:0;} #aside ul.left_menu > li.sel ul {display: block;} #aside ul.left_menu > li li a {display: block;border: 0;font-size: 15px; height:auto;padding: 5px 0;margin: 0;color: #333;} #aside ul.left_menu > li li:last-child a{border:0} #aside ul.left_menu > li li a:hover, #aside ul.left_menu > li li.sel a {font-size: 15px;color: #ed3b3e; border: 0;background-image: url(../_img/ico_left_submenu_on.png);background-position: 0 10px;background-size: 8px auto;} #aside .btn_diary {display: block;margin-top: 50px;} /* #design */ #design {position: relative;float: left;width: 1000px;} #blind{position:absolute;z-index:99998;top:0px;left:0px;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft{display:none;} #gotop, #gotop a{display:none !important} @keyframes mv00 { from {background-position:center 110px; } to {background-position:center 0px; } } @keyframes mv01 { from {top:100px; opacity:0;} to {top:170px; opacity:1;} } @keyframes mv02 { from {top:200px;opacity:0;} to {top:295px;opacity:1;} } @keyframes v_img { from {right:50px; opacity:0} to {right:0px; opacity:1} } @keyframes v_text { from {padding-left:30px; opacity:0} to {padding-left:0px; opacity:1} } @keyframes v_navi { from {margin-top:-20px; opacity:0} to {margin-top:0px; letter-spacing:-1px; opacity:1} } @keyframes con_bg { from {background:url(../_img/sub_con_bg.png) repeat-x left -30px; } to {background:url(../_img/sub_con_bg.png) repeat-x left 138px; } } } /* 1400 - 1500 header */ @media (max-width: 1500px) and (min-width: 1400px) { /* header */ #header {overflow: hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;height: 150px;padding: 0;transform: none;} #header::before {content: '';position: absolute;top: 60px;z-index: -1;width: 100%;height: 1px;background-color: rgba(0,0,0,0.1);} #header.sel {height: 300px;box-sizing: border-box;background: #fff;border-bottom: 1px solid #ccc;} #header.header_active {background-color: #fff;} #header.bg_white {background-color: #fff;border-bottom: 1px solid #d9d9d9;} #header .header {position: relative;width: 96%;height: 140px;padding: 60px 0 0;margin: 0 auto;} #header .header::after {content: '';display: block;clear: both;} #header h1 {position: absolute;top: 0;left: 0;width: 50%;} #header h1 a {display: block;width: 100%;height: 60px;background-image: url(../_img/logo.png?v=1);background-repeat: no-repeat;background-position: 0 50%;background-size: auto 32px;text-indent: -9999px;} #header.header_active h1 a, #header.bg_white h1 a {background-image: url(../_img/logo_on.png);} #header button.btn-menu {display:none} /**/ nav.menu_wrap {width: 100%;} #gnb .depth1 {height: 80px;text-align: center;margin: 0;font-size: 0;text-align: center;} #gnb .depth1::after {content: '';display: block;clear: both;} #gnb .depth1 > li {position: relative;float: none;display: inline-block;height: 300px;width: calc(100% / 6);padding: 0;} #gnb .depth1 > li:hover {background-color: #f1f6ff;} #gnb .depth1 > li > a {overflow: hidden;display:block;height: 80px;margin: 0;padding: 0;line-height: 80px;font-size: 20px;font-weight: 500;color: #000;text-overflow: ellipsis;white-space: nowrap;} #header.header_active #gnb .depth1 > li > a, #header.bg_white #gnb .depth1 > li > a {color: #333;} #gnb .depth1 > li > a em{position:absolute;top:23px;right:0;display:block;margin:-10px 0 0 0;width:1px;height:16px;background:#ccc;display:none} #header #gnb .depth1 > li.sel > a {color:#3e53d1;font-weight: 500;} #header #gnb .depth1 > li:hover > a, #header #gnb .depth1 > li > a:hover {color:#3e53d1;} #gnb .depth2{position:absolute;top: 100px;width: 100%;left: 0;text-align: center;visibility:hidden;box-sizing: border-box;} #header.sel #gnb .depth2 {display:block; top: 80px;left: 0;visibility:visible; transition: all 0.4s cubic-bezier(0.785, 0.135, 0.150, 0.860);} #gnb .depth2 li a{display:block;letter-spacing:-0.4px;padding: 7px 0;font-size:15px;text-align: center;color:#575757;word-break: keep-all;} #gnb .depth2 li a:hover{color:#dc4649;text-decoration: underline;} #gnb .depth2 li.sel a{color:#dc4649;} #gnb .depth1 > li > a::after {content: "";position:absolute;bottom: 0;left: 0;display:none;width: 100%;height: 5px;background: #558fff;} #gnb .nav_bg {display:none;position:absolute;top: 110px;left: 0;width: 100%;height: 400px;background: #f5f5f5;} #header .etc_wp {position: absolute;top: 0;right: 0;max-width: 50%;text-align: left;font-size: 0;vertical-align: top;} #header .etc_btn > ul {display: inline-block;vertical-align: middle;} #header .etc_btn > ul > li {display: inline-block;} #header .etc_btn > ul > li > a {display: block;padding: 0 10px;vertical-align: middle;font-size: 15px;line-height: 60px;color: #000;} #header.header_active .etc_btn > ul > li > a, #header.bg_white .etc_btn > ul > li > a {color: #333;} #header .etc_btn > a.cj_county {position: relative;z-index: 0;display: inline-block;padding-left: 15px;margin-left: 10px;vertical-align: middle;font-size: 15px;color: #fff;} #header.header_active .etc_btn > a.cj_county, #header.bg_white .etc_btn > a.cj_county {color: #333;} #header .etc_btn > a.cj_county::before {content: '';position: absolute;top: 50%;left: 0;width: 1px;height: 11px;margin-top: -5.5px;background-color: #fff;line-height: 50px;} #header.header_active .etc_btn > a.cj_county::before, #header.bg_white .etc_btn > a.cj_county::before {background-color: #d9d9d9;} #header.fix_menu {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.fix_menu #gnb .depth1 > li > a {color:#333;} #header.fix_menu #gnb .depth1 > li.sel > a {color: #3e53d1;} } /* 841 ~ 1399 */ @media all and (min-width: 768px) and (max-width: 1399px) { #divpop { display:none;} #mm-blocker{display:none} #popupWindow{position:absolute} #hCheon {position:relative;top:0px;padding:0; margin:0;width:100%;} #OpenLayer {position: absolute;top: 180px;left: 100px;z-index: 9999;background: #fff;padding: 10px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 14px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} /* header */ #header {overflow: hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;height: 150px;padding: 0;} #header::before {content: '';position: absolute;top: 60px;z-index: -1;width: 100%;height: 1px;background-color: rgba(0,0,0,0.1);} #header.sel {height: 300px;box-sizing: border-box;background: #fff;border-bottom: 1px solid #ccc;} #header.header_active {background-color: #fff;} #header.bg_white {background-color: #fff;border-bottom: 1px solid #d9d9d9;} #header .header {position: relative;width: 96%;height: 140px;padding: 60px 0 0;margin: 0 auto;} #header .header::after {content: '';display: block;clear: both;} #header h1 {position: absolute;top: 0;left: 0;width: 50%;} #header h1 a {display: block;width: 100%;height: 60px;background-image: url(../_img/logo.png?v=1);background-repeat: no-repeat;background-position: 0 50%;background-size: auto 30px;text-indent: -9999px;} #header.header_active h1 a, #header.bg_white h1 a {background-image: url(../_img/logo_on.png);} #header button.btn-menu {display:none} /**/ nav.menu_wrap {width: 100%;} #gnb .depth1 {height: 80px;text-align: center;margin: 0;font-size: 0;text-align: center;} #gnb .depth1::after {content: '';display: block;clear: both;} #gnb .depth1 > li {position: relative;float: none;display: inline-block;height: 300px;width: calc(100% / 6);padding: 0;} #gnb .depth1 > li:hover {background-color: #e9f8f3;} #gnb .depth1 > li > a {overflow: hidden;display:block;height: 80px;margin: 0;padding: 0;line-height: 80px;font-size: 20px;font-weight: 500;color: #000;text-overflow: ellipsis;white-space: nowrap;} #header.header_active #gnb .depth1 > li > a, #header.bg_white #gnb .depth1 > li > a {color: #333;} #gnb .depth1 > li > a em{position:absolute;top:23px;right:0;display:block;margin:-10px 0 0 0;width:1px;height:16px;background:#ccc;display:none} #header #gnb .depth1 > li.sel > a {color:#3e53d1;font-weight: 500;} #header #gnb .depth1 > li:hover > a, #header #gnb .depth1 > li > a:hover {color:#138b4f;} #gnb .depth2{position:absolute;top: 100px;width: 100%;left: 0;text-align: center;visibility:hidden;box-sizing: border-box;} #header.sel #gnb .depth2 {display:block; top: 80px;left: 0;visibility:visible; transition: all 0.4s cubic-bezier(0.785, 0.135, 0.150, 0.860);} #gnb .depth2 li a{display:block;letter-spacing:-0.4px;padding: 7px 0;font-size:15px;text-align: center;color:#575757;word-break: keep-all;} #gnb .depth2 li a:hover{color:#dc4649;text-decoration: underline;} #gnb .depth2 li.sel a{color:#dc4649;} #gnb .depth1 > li > a::after {content: "";position:absolute;bottom: 0;left: 0;display:none;width: 100%;height: 5px;background: #558fff;} #gnb .nav_bg {display:none;position:absolute;top: 110px;left: 0;width: 100%;height: 400px;background: #f5f5f5;} #header .etc_wp {position: absolute;top: 0;right: 0;max-width: 50%;text-align: left;font-size: 0;vertical-align: top;} #header .etc_btn > ul {display: inline-block;vertical-align: middle;} #header .etc_btn > ul > li {display: inline-block;} #header .etc_btn > ul > li > a {display: block;padding: 0 10px;vertical-align: middle;font-size: 15px;line-height: 60px;color: #000;} #header.header_active .etc_btn > ul > li > a, #header.bg_white .etc_btn > ul > li > a {color: #333;} #header .etc_btn > a.cj_county {position: relative;z-index: 0;display: inline-block;padding-left: 15px;margin-left: 10px;vertical-align: middle;font-size: 15px;color: #fff;} #header.header_active .etc_btn > a.cj_county, #header.bg_white .etc_btn > a.cj_county {color: #333;} #header .etc_btn > a.cj_county::before {content: '';position: absolute;top: 50%;left: 0;width: 1px;height: 11px;margin-top: -5.5px;background-color: #fff;line-height: 50px;} #header.header_active .etc_btn > a.cj_county::before, #header.bg_white .etc_btn > a.cj_county::before {background-color: #d9d9d9;} #header.fix_menu {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.fix_menu #gnb .depth1 > li > a {color:#333;} #header.fix_menu #gnb .depth1 > li.sel > a {color: #3e53d1;} /**/ #mainCon {width: 100%;padding-bottom: 80px;} #mainCon section .section_inner {width: 94%;margin: 0 auto;} #mainCon section .section_inner h3 {font-size: 26px;font-weight: 700;color: #000;} #mainCon section .section_inner h3.white {color: #fff;} #mainCon section .section_inner .sub_tit { font-size: 16px; color: #3f3f3f; position: relative; padding: 0 0 3px 25px;} /* 메인비주얼 */ #visual {padding-top: 150px;background-color: #f0faf7;background-image: url(../_img/bg_visual.png);background-repeat: no-repeat;background-position: 100% 100%;background-size: auto 180px;} #visual .m_visual {position: relative;display: flex;justify-content: space-between;} #visual .m_visual::before {content: '';position: absolute;bottom: -58px;right: 0;width: 520px;height: 235px;background-image: url(../_img/ico_m_visual.png);background-repeat: no-repeat;background-position: calc(100% - 25px) 100%;background-size: 100%;} #visual .m_visual::after {content: '';position: absolute;bottom: -45px;right: 500px;width: 23%;height: 160px;/*background-image: url(../_img/ico_m_visual2.png);background-repeat: no-repeat;background-position: 0 100%;*/} #visual .m_visual .v_img {flex: 0 1 56%;padding-bottom: 100px;padding-right: 30px;} #visual .m_visual .v_img a {display: block;line-height: 1;} #visual .m_visual .v_guide {flex: 0 0 460px;margin-top: 5%;background-image: url(../_img/bg_m_ticket.png);background-repeat: repeat-y;background-position: 50% 0;} #visual .m_visual .v_guide > div {padding: 15px 35px 25px;background-image: url(../_img/shape_m_ticket.png);background-repeat: no-repeat;background-position: 100% 0;background-size: auto 100%;border-radius: 30px;} #visual .m_visual .v_guide .v_date {display: flex;align-items: flex-end;} #visual .m_visual .v_guide .v_date > span {font-size: 18px;font-weight: 500;color: #000;line-height: 1.2em;} #visual .m_visual .v_guide .v_date > span.date {margin-left: 20px;font-size: 55px;font-weight: 500;color: #dc4649;line-height: 0.9em;} #visual .m_visual .v_guide .v_txt {display: table;width: 100%;margin-top: 20px;} #visual .m_visual .v_guide .v_txt > div {display: table-cell;} #visual .m_visual .v_guide .v_txt > div div.end {margin-top: 2px;} #visual .m_visual .v_guide .v_txt > div span {display: inline-block;font-size: 16px;font-weight: 500;} #visual .m_visual .v_guide .v_txt > div.receipt span {color: #3e53d1;} #visual .m_visual .v_guide .v_txt > div.race span {color: #e0474b;} #visual .m_visual .v_guide .v_txt > div span.tit {padding: 8px 20px;margin-right: 5px;border-radius: 50px;font-size: 15px;color: #fff;} #visual .m_visual .v_guide .v_txt > div.receipt span.tit {background-color: #3e53d1;} #visual .m_visual .v_guide .v_txt > div.race span.tit {background-color: #e0474b;} #visual .m_visual .v_img .btn_pick {line-height: 45px;width: 343px;padding: 5px;height: 60px;font-size: 25px;font-weight: 500;text-align: center;color: #6d6d6d;background-color: #fff;border-radius: 35px;} #visual .m_visual .v_img .pop {/*max-width: 650px;min-height: 410px;*/padding: 40px;color: #fff;border-radius:30px;background-color: var(--mainPop);background-repeat: no-repeat;background-image: url(../_img/main_pop_book.png);background-position: 100% 100%;background-size: 30%;} #visual .m_visual .v_img .pop .btn {margin-top:20px;} #visual .m_visual .v_img .tit {padding: 0px;color: #fff;font-size: 30px;font-weight: 700;background-color: var(--mainPop);} #visual .m_visual .v_img .day {display: flex;margin: 10px 0px;color: #fff;font-size: 17px;background-color: var(--mainPop);flex-wrap: wrap;} #visual .m_visual .v_img .p9872 {font-size: 25px;margin-right:10px;} #visual .m_visual .v_img .dc_seq {font-size:14px;} #visual .m_visual .v_img .course_list {display: flex;flex-wrap: wrap;} #visual .m_visual .v_img .course_list > li {overflow: hidden;width: calc(50% - 20px);font-size: 18px;margin: 0px;border-radius: 10px;text-align: left;background-repeat: no-repeat;} /* #visual .m_visual .v_img .course_list > li:first-child {background-image: url(../_img/ico_select_person1.png);background-position: calc(100% - 10px) 100%;background-size: auto 225px;} #visual .m_visual .v_img .course_list > li:last-child {background-image: url(../_img/ico_select_person2.png);background-position: calc(100% - 20px) 100%;background-size: auto 180px;} */ #visual .m_visual .v_img .course_list > li:nth-child(-n+2) {margin-top: 0;} #visual .m_visual .v_img .course_list > li:nth-child(2n-1) {margin-left: 0;} #visual .m_visual .v_img .course_list > li:nth-child(2n) {margin-right: 0;} /* #section1 */ #section1 {padding: 70px 0 40px;background-color: #eee;} #section1 .m_direct {margin-bottom: 70px;} #section1 .m_direct > ul {display: flex;flex-wrap: wrap;} #section1 .m_direct > ul > li {width: 30%;margin: 1.665%;text-align: center;} #section1 .m_direct > ul > li > a {display: block;padding: 30px 20px;font-size: 22px;font-weight: 700;color: #420d64;border-radius: 15px;background-color: #fff;box-shadow: 10px 10px 30px rgba(0,0,0,0.07);} /*#section1 .m_direct > ul > li.direct1 > a {background-color: #3e53d1;} #section1 .m_direct > ul > li.direct2 > a {background-color: #dc4649;} #section1 .m_direct > ul > li.direct3 > a {background-color: #7e8ef0;} #section1 .m_direct > ul > li.direct4 > a {background-color: #3e53d1;} #section1 .m_direct > ul > li.direct5 > a {background-color: #47aa8b;}*/ #section1 .m_direct > ul > li > a::before {content: '';display: block;height: 55px;margin-bottom: 15px;background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 100%;} #section1 .m_direct > ul > li.direct1 > a::before {background-image: url(../_img/ico_m_direct1.png?v=1);} #section1 .m_direct > ul > li.direct2 > a::before {background-image: url(../_img/ico_m_direct2.png?v=1);} #section1 .m_direct > ul > li.direct3 > a::before {background-image: url(../_img/ico_m_direct3.png?v=1);} #section1 .m_direct > ul > li.direct4 > a::before {background-image: url(../_img/ico_m_direct4.png?v=1);} #section1 .m_direct > ul > li.direct5 > a::before {background-image: url(../_img/ico_m_direct5.png?v=1);} #section1 .my_race {display: flex;} #section1 .my_race .title_wp {flex: 0 0 145px;position: relative;} #section1 .my_race .title_wp::after {content: '';position: absolute;bottom: -55px;left: -15px;width: 180px;height: 155px;background-image: url(../_img/ico_m_my_title.png?v=1);background-repeat: no-repeat;background-position: 0 100%;background-size: auto 100%;} #section1 .my_race .track_wp {position: relative;width: calc(100% - 145px);padding: 130px 45px 80px 100px;background-image: url(../_img/ico_m_my_track.png);background-repeat: no-repeat;background-position: 50% 88px;} #section1 .my_race .track_wp .start, #section1 .my_race .track_wp .finish {position: absolute;background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999px;} #section1 .my_race .track_wp .start {top: 35px;left: 0;width: 140px;height: 105px;background-image: url(../_img/ico_m_my_start.png);background-size: auto 100%;} #section1 .my_race .track_wp .finish {top: -10px;right: -10px;width: 100px;height: 120px;background-image: url(../_img/ico_m_my_finish.png?v=1);background-size: auto 100%;} #section1 .my_race .track_wp .finish.end {display: none;} #section1 .my_race .track_wp .track {position: relative;z-index: 10;width: 100%;height: 11px;border-radius: 6px;background-color: #acaaeb;} #section1 .my_race .track_wp .track::before {content: '';} #section1 .my_race .track_wp .track > span {position: absolute;display: inline-block;padding-top: 25px;text-align: center;font-size: 13px;font-weight: 700;color: #000;line-height: 1.2em;transform: translateX(-50%);} #section1 .my_race .track_wp .track > span::before {content: '';position: absolute;top: -1px;left: 50%;z-index: 2;width: 13px;height: 13px;margin-left: -6px;background-color: #fff;border-radius: 50%;} #section1 .my_race .track_wp .track > span.step0 {color: rgba(0,0,0,0.4);} #section1 .my_race .track_wp .track > span.step0::after {content: '';position: absolute;top: 0;left: 0;z-index: 1;width: 15px;height: 12px;background-color: #eee;} #section1 .my_race .track_wp .track > span.me {position: absolute;z-index: 5;display: inline-block;padding: 25px 0 45px;text-align: center;font-size: 15px;font-weight: 700;color: #fff;line-height: 1.2em;transform: translateX(-50%);} #section1 .my_race .track_wp .track > span.me::before {content: '';position: absolute;top: -1px;left: 50%;z-index: 2;width: 13px;height: 13px;margin-left: -6px;background-color: #fff;border-radius: 50%;} #section1 .my_race .track_wp .track > span.me::after {content: '';position: absolute;top: -100%;left: 50%;z-index: 9;width: 85px;height: 80px;/*background-image: url(../_img/ico_man_run.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-90%);background-size: auto 100%;*/} #section1 .my_race .track_wp .track > span.me.end::after {top: -155px;height: 150px;background-image: url(../_img/ico_man_finish.png);} /* #section2 */ #section2 .section_inner {display: flex;justify-content: space-between;flex-wrap: wrap;padding: 70px 0;} #section2 h3 {position: relative;margin-bottom: 35px;} #section2 h3 a.more {position: absolute;top: 10px;right: 0;width: 20px;height: 20px;background-image: url(../_img/ico_m_more.png);background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999em;} #section2 .section_inner > div {width: 45%;} #section2 .section_inner > div + div {margin-top: 70px;} #section2 .section_inner > div.start.graph_wp {order: 1;} #section2 .section_inner > div.end.graph_wp {order: 2;margin-top: 0;} #section2 .section_inner > div.notice_wp {order: 3;/*margin: 70px 0;*/width: calc(100% - 320px);} #section2 .graph_wp .graph {height: calc(100% - 75px);} #section2 .graph_wp .graph > div {display: flex;width: 100%;height: 60px;align-items: center;justify-content: space-between;} #section2 .graph_wp .graph > div > span {vertical-align: middle;} #section2 .graph_wp .graph > div > span.tit {width: 100px;font-size: 17px;font-weight: 700;} #section2 .graph_wp .graph > div > span.con {position: relative;z-index: 0;width: calc(79% - 100px);height: 30px;text-align: left;} #section2 .graph_wp .graph > div > span.con > span {position: absolute;top: 50%;left: 0;z-index: -1;min-width: 2px;max-width: 100%;height: 30px;margin-top: -15px;background-color: #3db08b;} #section2 .graph_wp .graph > div > span.num {width: 21%;text-align: right;font-size: 14px;} #section2 .notice_wp .notice ul > li + li {margin-top: 20px;} #section2 .notice_wp .notice ul > li > a {overflow: hidden;display: block;text-overflow: ellipsis;white-space: nowrap;font-size: 16px;color: #000;} #section2 .notice_wp .notice ul > li > span.date {display: block;margin-top: 3px;font-size: 14px;color: #757575;} #section2 .section_inner .m_history {order: 5;position: relative;width: 100%;padding-right: 20px;} #section2 .section_inner .m_history::before {content: '';position: absolute;right: -10px;bottom: 0;width: 175px;height: 100%;background-image: url(../_img/ico_m_history.png);background-repeat: no-repeat;background-position: 100% 100%;} #section2 .section_inner .m_history > div {padding: 35px 155px 45px 40px;background-color: #f4f4f4;border-radius: 50px;} #section2 .section_inner .m_history > div h3, #section2 .section_inner .m_history > div .slider {vertical-align: top;} #section2 .section_inner .m_history > div .slider .slick-list {overflow: hidden;} #section2 .section_inner .m_history > div .slider li {padding: 10px 0;} #section2 .section_inner .m_history > div h3 {margin-bottom: 15px;} #section2 .section_inner .m_history > div h3 {width: 150px;padding-right: 50px;font-size: 28px;} #section2 .section_inner .m_history > div .slider li span {display: block;font-size: 16px;font-weight: 400;color: #000;vertical-align: middle;} #section2 .section_inner .m_history > div .slider li span.kind {margin-bottom: 5px;width: 57px;height: 24px;margin-right: 10px;border-radius: 12px;text-align: center;background-color: #dc4649;color: #fff;font-size: 14px;font-weight: 500;line-height: 24px;text-transform: uppercase;} #section2 .section_inner .m_history > div .slider li span.con {width: 100%;} #section2 .section_inner .m_history > div .slider li span.date {margin-top: 7px;font-size: 14px;color: #757575;} #section2 .section_inner .m_qna {order: 4;width: 270px;margin: 70px 0;} #section2 .section_inner .m_qna > a {display: block;padding-right: 70px;background-image: url(../_img/ico_m_qna.png);background-repeat: no-repeat;background-position: 100% 0;} #section2 .section_inner .m_qna > a .tit {display: block;font-size: 24px;font-weight: 700;color: #000;line-height: 1.2em;} #section2 .section_inner .m_qna > a .btn {display: inline-block;height: 45px;margin-top: 20px;padding: 0 25px;font-size: 15px;font-weight: 500;color: #fff;background-color: #631992;line-height: 45px;border-radius: 45px;} /**/ #section3 h3 {margin-bottom: 15px;} #section3 .hall_wp {display: flex;flex-wrap: wrap;} #section3 .hall_wp > div {position: relative;width: 22%;margin: 3.3% 1.5%;padding: 25px 20px;margin-top: 35px;background-color: #eee9f2;border-radius: 50px;text-align: center;} #section3 .hall_wp > div::before {content: '';position: absolute;top: -35px;left: 50%;width: 100%;height: 60px;background-image: url(../_img/ico_rank.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-50%);} #section3 .hall_wp p.title {margin-bottom: 15px;padding: 8px 0;background-color: #6da221;font-size: 18px;font-weight: 500;color: #fff;border-radius: 50px;} #section3 .hall_wp .list > li {font-size: 18px;font-weight: 500;color: #000;} #section3 .hall_wp .list > li + li {margin-top: 5px;} #section3 .hall_wp .list > li > span {display: inline-block;vertical-align: middle;} #section3 .hall_wp .list > li > span.num {margin: 0 10px 0 -10px;width: 26px;height: 26px;font-size: 14px;line-height: 26px;background-image: url(../_img/shape_rank_list.png);background-repeat: no-repeat;background-position: 50% 50%;} /**/ #footer {background-color: #333;} #footer .footer {display: flex;justify-content: space-between;width: 94%;margin: 0 auto;padding: 50px 0;} #footer .f_left {max-width: 75%;} #footer .f_left .f_logo img {height: 35px;} #footer .f_left .f_link {margin: 20px 0;} #footer .f_left .f_link > a {font-size: 17px;color: #fff;font-weight: 400;} #footer .f_left .f_link > a.privacy {color: #daa0fe;} #footer .f_left .f_link > a + a {margin-left: 20px} #footer .f_left address {font-size: 16px;color: #fff;line-height: 1.5em;font-style: normal;} #footer .f_left address > span.addr {display: block;} #footer .f_left address > span strong {font-weight: 700;} #footer .f_left address .tel > span {display: inline-block;margin-right: 15px;} #footer .f_left address .tel > span:last-child {margin-right: 0;} #footer .f_left cite {display: block;margin-top: 20px;font-style: normal;font-size: 16px;color: #fff;} #footer .f_right {text-align: right;} #footer .f_right .go_top > button {width: 73px;height: 73px;border-radius: 30px;background-color: #34b574;background-image: url(../_img/ico_w_top_arrow.png);background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999px;} #footer .f_right .web_count {margin-top: 25px;} #footer .f_right .web_count > span {font-size: 16px;color: #fff;} #footer .f_right .web_count > span + span {margin-left: 35px;} /**/ #contain {overflow: hidden;position: relative;width: 100%;} #contain .contain {max-width: 1440px;margin: 0 auto;} #contain .contain::after {content: '';display: block;clear: both;} /*#contain .contain {margin: 30px auto 0;max-width:1560px;overflow: hidden;position:relative;} #contain + #footer .contact {display:none;}*/ /* 서브비주얼 */ #contain #subVisual {width: 100%;height: 360px;padding-top: 150px;background-color: #f1f6ff;background-image: url(../_img/bg_visual.jpg);background-repeat: no-repeat;background-position: 50% 100%;background-size: cover;} /*#contain #subVisual .sub_visual .visual_wp {display: table;width: 100%;max-width: 1240px;height: 110px;margin: 70px auto 0;padding-left: 240px;} #contain #subVisual .sub_visual .visual_wp .visual {display: table-cell;vertical-align: middle;} #contain #subVisual .sub_visual .visual_wp .visual h2 {font-size: 30px;font-weight: 500;color: #fff;}*/ #contain #subVisual .sub_visual {position: relative;width: 94%;height: 100%;margin: 0 auto;text-align: center;} #contain #subVisual .sub_visual h3 {padding-top: 10px;margin-bottom: 0;font-size: 34px;font-weight: 700;color: #000;} #contain #subVisual .sub_visual .locator {margin-top: 5px;} #contain #subVisual .sub_visual .locator > ul > li {display: inline-block;vertical-align: middle;} #contain #subVisual .sub_visual .locator > ul > li a, #contain #subVisual .sub_visual .locator > ul > li span, #contain #subVisual .sub_visual .locator > ul > li button {display: block;font-size: 16px;font-weight: 400;color: #000;font-family: inherit;background-color: transparent;} #contain #subVisual .sub_visual .locator > ul > li button::before, #contain #subVisual .sub_visual .locator > ul > li span::before {content: '>';display: inline-block;width: 20px;vertical-align: top;text-align: center;font-size: inherit;font-family: inherit;} #contain #subVisual .sub_visual .locator .navi {display: none;} #contain #subVisual .sub_visual::after {content: '';position: absolute;top: 88px;right: -14%;width: 923px;height: 526px; /*background-image: url(../_img/bg_sub_contents.png);*/background-repeat: no-repeat;background-position: 50% 50%;} #contain #subVisual .sub_visual::before {content: '';position: absolute;bottom: -15px;left: 0;width: 50%;height: 115px;background-image: url(../_img/ico_sub_visual.png);background-repeat: no-repeat;background-position: 0 100%;background-size: auto 100%;} #contain #subVisual .sub_visual .ticket_marathon {position: absolute;top: 0;right: 0;z-index: 1;width: 300px;height: 150px;padding: 20px 30px;background-image: url(../_img/shape_ticket.png);background-repeat: no-repeat;background-position: 0 50%;background-size: auto 100%;} #contain #subVisual .sub_visual .ticket_marathon > p {display: flex;text-align: left;align-items: flex-end;} #contain #subVisual .sub_visual .ticket_marathon > p span {font-size: 16px;font-weight: 500;color: #fff;} #contain #subVisual .sub_visual .ticket_marathon > p strong {margin-left: 10px;font-size: 50px;font-weight: 500;color: #ff5b5e;line-height: 1;} #contain #subVisual .sub_visual .ticket_marathon a.btn {display: block;width: 90%;margin-top: 15px;padding: 10px 20px;background-color: #38448a;font-size: 16px;font-weight: 500;color: #fff;background-image: url(../_img/ico_w_arrow.png);background-repeat: no-repeat;background-position: calc(100% - 20px) 50%;text-align: left;border-radius: 100px;} /**/ #container {width: 94%;min-height: 500px;margin: 45px auto 100px;} #container::after {content: '';display: block;clear: both;} /**/ #aside {float: left;width: 210px;margin: 0 40px 0 0;} #aside h2 {padding-bottom: 35px;text-align: center;font-size: 24px;font-weight: 700;color: #1f2a69;border-bottom: 1px solid #e5e5e5;} #aside ul.left_menu > li {border-bottom:1px solid #e5e5e5;} #aside ul.left_menu > li > ul > li {border-bottom: 0;} #aside ul.left_menu > li > a {position: relative;z-index: 0;display:block;padding: 15px 20px;font-size: 17px;font-weight: 400;color:#000;transition:all 0.3s;} #aside ul.left_menu > li > a:hover {color: #1f2a69;font-weight: 400;transition: all 0.3s;} #aside ul.left_menu > li.sel > a::after {content: '';position: absolute;top: 50%;right: 20px;z-index: -1;width: 12px;height: 10px;margin-top: -5px;background-image: url(../_img/ico_w_arrow.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 10px;);background-size: auto 100%;} #aside ul.left_menu > li.sel > a, #aside ul.left_menu > li.sel > a:hover{color: #fff;border: 0;background-color: #1f2a69;transition:all 0.5s} #aside ul.left_menu > li ul {padding: 15px 20px;background:#f3f3f3; border-top:0;} #aside ul.left_menu > li.sel ul {display: block;} #aside ul.left_menu > li li a {display: block;border: 0;font-size: 15px; height:auto;padding: 5px 0;margin: 0;color: #333;background-image: url(../_img/ico_left_submenu.gif);background-repeat: no-repeat;background-position: 0 15px;background-size: auto 1px;} #aside ul.left_menu > li li:last-child a{border:0} #aside ul.left_menu > li li a:hover, #aside ul.left_menu > li li.sel a {font-size: 15px;color: #ed3b3e; border: 0;background-image: url(../_img/ico_left_submenu_on.png);background-position: 0 10px;background-size: 8px auto;} #aside .btn_diary {display: block;margin-top: 50px;} /* #design */ #design {position: relative;float: left;width: calc(100% - 250px);min-height: 500px;} /**/ #blind {position:absolute;z-index: 49999;top:0px;left:0px; bottom:0;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft {display:none;position:absolute;z-index:10;left:0px;top:0px;width: 90%;height: 100%;background:#1e2c5d;padding-bottom: 60px;} #dkleft .lefttit{padding: 15px 20px;text-align:left;width: 100%;box-sizing: border-box;background:#1e2c5d;} #dkleft .lefttit img{height: 25px;} /*#dkleft .select {height: 100%;overflow-y: auto;} #dkleft .lefttit button {display:block;position:relative;padding: 20px 15px;font-size: 16px;color:#fff;border:0;background:transparent;font-family: 'Montserrat';font-weight: 500;} #dkleft .lefttit button i {display: inline-block;padding: 0 7px 0 0;font-size: 15px;color:#fff;vertical-align: middle;}*/ #dkleft .select {border-top: 5px double rgba(255,255,255,0.3);height: 100%;overflow-y: auto;} /*#dkleft .lefttit button {display:block;padding: 7px 20px;background-color: #fff;color: #000;font-family: inherit;border-radius: 10px;font-size: 15px;}*/ #dkleft .lefttit a.log_btn {display:block;max-width: calc(100% - 100px);} #dkleft .lefttit a.log_btn > span {display: inline-block;padding: 7px 20px;background-color: #fff;color: #000;font-family: inherit;border-radius: 10px;font-size: 15px;} #dkleft .lefttit a.go_lib {display: inline-block;margin-top: 5px;padding: 8px 20px;border-radius: 10px;border: 1px solid #fff;color: #fff;} #dkleft .lefttit > div {background-color: #eee;padding: 0 15px;} #dkleft .lefttit .join{display:inline-block;position:relative;padding:0 10px;height:36px;line-height:36px;margin:5px 0;font-size:15px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .lefttit .join i{padding:0 7px 0 0;font-size:24px;color:#1e2c5d} #dkleft .lefttit .idpw{display:inline-block;position:relative;padding:0 10px;height:36px;line-height:36px;margin:5px 0;font-size:15px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .lefttit .sel_btn {display:inline-block;position:relative;padding:0 8px;height:36px;line-height:36px;margin:5px 0;font-size:14px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .lefttit .mobile_member {display: block;padding-bottom: 5px;border-top: 1px solid rgba(255,255,255,0.3);} #dkleft .lefttit .mobile_member > a {display: block;padding: 10px 0 10px 35px;color: #fff;font-size: 15px;box-sizing: border-box;background: url(../_img/member_icon.png) no-repeat 0 50%;} #dkleft .select .modify{display:block;position:relative;padding:0 17px;line-height:45px;font-size:16px;color:#000;border-bottom:1px solid #ccc;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .select .modify span {display:inline-block;padding:0 16px;height:36px;line-height:36px;background:#2e4287;color:#fff;border-radius:5px;} #dkleft .select .modify i{display:inline-block;position:relative;top:1px;padding:0 7px 0 0;font-size:24px;color:#fff} #dkleft .depth1{display:block;width: 100%;position:relative;padding: 0 15px;line-height:50px;font-size:16px;color:#fff;text-align:left;border-bottom: 1px solid rgba(255, 255, 255, .1);transition:all 0.2s ease-out 0s;background-color: transparent;} #dkleft .depth1 strong {position:relative;top:-2px;padding:0 4px;height:14px;line-height:14px;font-size:10px;background:#ff0000;border-radius:30px} #dkleft .depth1 span{font-style:normal;color:#ffa800} #dkleft .depth1 em{position:absolute;z-index:2;top:0;right:4px;width:39px;height:39px;background:url(/web/seomun/_img/common/plus.png) no-repeat 50% 50%;background-size:11px 11px} #dkleft .depth1.sel {background: #2e4287;color:#fff;border-bottom:1px solid #596170} /*#dkleft .depth1 i {font-family:Linearicons-Free;display:block;margin:15px 15px 0 0;color:#aaa;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s}*/ #dkleft .depth1 i {display:block;width: 20px;height: 20px;margin: 15px 15px 0 0;background-image: url(../_img/ico_dkleft_arrow.png);background-size: auto 7px;text-indent: -9999px;background-repeat: no-repeat;background-position: 50% 50%;transition:all 0.2s ease-out 0s;} #dkleft .depth1 i.rightico {float:right} #dkleft .depth1.sel i.rightico{color:#fff;transform:rotate(180deg);transition:all 0.2s ease-in-out 0s;} #dkleft .depth2{display:none;background:#fff} #dkleft .depth2 a{display:block;padding:0 20px;line-height:40px;font-size:14px;color:#555;border-bottom:1px solid #ddd;text-decoration:none} #dkleft .depth2 a.sel{color:#81c341} #dkleft .depth2 .depth3 {background-color: #f4f4f4;} #dkleft .depth2 .depth3 > li > a {display: block;font-size: 13px;padding: 7px 20px;color: #555;border-bottom: 0;line-height: 1.2em;} #dkleft .depth2 .depth3 > li:first-child > a {padding-top: 15px;} #dkleft .depth2 .depth3 > li:last-child > a {padding-bottom: 15px;border-bottom: 1px solid #ddd;} #closeleft{position: absolute;z-index: 9999999;left: -60px;top: 10px;width: 50px;height: 50px;display: block;text-align: center;font-size: 30px;font-family: Linearicons-Free;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;color: #fff;background-image: url(../_img/wclose.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 25px;cursor: pointer;} /*#closeleft:before{content:"\e870";font-size:30px;line-height:1;}*/ #gotop{display: none;position:fixed;z-index:90000;bottom:20px;right:20px;display:none} #gotop a{display:block;width:40px;height:30px;padding:30px 0 0 0;font-size:10px;font-weight:800;text-align:center;color:#fff;background:rgba(0,0,0,0.3) url(../_img/gotop.png) no-repeat 48% 28%;border-radius:50px;overflow:hidden} @keyframes mv00 { from {background-position:center 110px; } to {background-position:center 0px; } } @keyframes mv01 { from {top:100px; opacity:0;} to {top:170px; opacity:1;} } @keyframes mv02 { from {top:200px;opacity:0;} to {top:295px;opacity:1;} } @keyframes v_img { from {right:50px; opacity:0} to {right:0px; opacity:1} } @keyframes v_text { from {padding-left:30px; opacity:0} to {padding-left:0px; opacity:1} } @keyframes v_navi { from {margin-top:-20px; opacity:0} to {margin-top:0px; letter-spacing:-1px; opacity:1} } @keyframes con_bg { from {background:url(../_img/sub_con_bg.png) repeat-x left -30px; } to {background:url(../_img/sub_con_bg.png) repeat-x left 138px; } } } @media all and (max-width: 1099px) { /* header */ #header {overflow: hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;height: 60px !important;padding: 0;} #header::before {content: '';position: absolute;top: 59px;width: 100%;height: 1px;background-color: rgba(0,0,0,0.1);} #header.sel {height: 510px;box-sizing: border-box;background:#fff;} #header.header_active {background-color: #fff;} #header.bg_white {background-color: #fff;border-bottom: 1px solid #d9d9d9;} #header .header {position: relative;height: 60px;padding: 0;margin: 0 auto;} #header .header::after {content: '';display: block;clear: both;} #header h1 {position: absolute;top: 0;left: 0;width: 100%;max-width: none;} #header h1 a {display: block;width: 100%;height: 60px;background-image: url(../_img/logo.png?v=1);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 28px;} #header.header_active h1 a, #header.bg_white h1 a {background-image: url(../_img/logo_on.png);} #header button.btn-menu {position:absolute;top: 0;right: 3%;z-index: 10;display: block;width:30px;height: 60px;background-image: url(../_img/ico_menu.png);background-repeat: no-repeat;background-position: 100% 50%;} #header button.btn-menu i{display: none !important;font-size:24px !important;color: #000;} #header button.btn-page{height:40px;width:40px;text-align:center;top:36px;right:10px;display:block;line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page2{height:40px;width:48px;text-align:center;top:36px;right:55px;display:block; line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page i{display:block !important;padding:5px 0 0 0;height:20px;font-size:18px !important; } /**/ nav.menu_wrap {} #gnb {display: none;} #header .etc_wp {display: none;} #header button.btn-menu {position:absolute;top: 0;left: 0;z-index: 10;width: 60px;height: 60px;background: url(../_img/ico_menu.png) no-repeat 50% 50%;} #header.bg_white button.btn-menu {background-image: url(../_img/ico_menu_on.png);} #header button.btn-menu i{display: none !important;font-size:24px !important;color: #000;} #header button.btn-page{height:40px;width:40px;text-align:center;top:36px;right:10px;display:block;line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page2{height:40px;width:48px;text-align:center;top:36px;right:55px;display:block; line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page i{display:block !important;padding:5px 0 0 0;height:20px;font-size:18px !important; } /**/ #mainCon {width: 100%;padding-bottom: 60px;} #mainCon section .section_inner {width: 94%;margin: 0 auto;} #mainCon section .section_inner h3 {font-size: 22px;font-weight: 700;color: #000;} #mainCon section .section_inner h3.white {color: #fff;} #mainCon section .section_inner .sub_tit { font-size: 16px; color: #3f3f3f; position: relative; padding: 0 0 3px 25px;} /* 메인비주얼 */ #visual {padding-top: 80px;background-color: #f0faf7;background-image: url(../_img/bg_visual.png);background-repeat: no-repeat;background-position: 100% 100%;background-size: auto 180px;} #visual .m_visual {position: relative;display: flex;justify-content: space-between;} #visual .m_visual::before {content: '';position: absolute;bottom: -58px;right: 0;width: 520px;height: 235px;background-image: url(../_img/ico_m_visual.png);background-repeat: no-repeat;background-position: calc(100% - 25px) 100%;background-size: 100%;} #visual .m_visual::after {content: '';position: absolute;bottom: -45px;right: 500px;width: 23%;height: 160px;/*background-image: url(../_img/ico_m_visual2.png);background-repeat: no-repeat;background-position: 0 100%;*/} #visual .m_visual .v_img {flex: 0 1 56%;padding-bottom: 100px;padding-right: 30px;} #visual .m_visual .v_img a {display: block;line-height: 1;} #visual .m_visual .v_guide {flex: 0 0 460px;margin-top: 5%;background-image: url(../_img/bg_m_ticket.png);background-repeat: repeat-y;background-position: 50% 0;z-index: 1;} #visual .m_visual .v_guide > div {padding: 15px 35px 25px;background-image: url(../_img/shape_m_ticket.png);background-repeat: no-repeat;background-position: 100% 0;background-size: auto 100%;border-radius: 30px;} #visual .m_visual .v_guide .v_date {display: flex;align-items: flex-end;} #visual .m_visual .v_guide .v_date > span {font-size: 18px;font-weight: 500;color: #000;line-height: 1.2em;} #visual .m_visual .v_guide .v_date > span.date {margin-left: 20px;font-size: 55px;font-weight: 500;color: #dc4649;line-height: 0.9em;} #visual .m_visual .v_guide .v_txt {display: table;width: 100%;margin-top: 20px;} #visual .m_visual .v_guide .v_txt > div {display: table-cell;} #visual .m_visual .v_guide .v_txt > div div.end {margin-top: 2px;} #visual .m_visual .v_guide .v_txt > div span {display: inline-block;font-size: 16px;font-weight: 500;} #visual .m_visual .v_guide .v_txt > div.receipt span {color: #3e53d1;} #visual .m_visual .v_guide .v_txt > div.race span {color: #e0474b;} #visual .m_visual .v_guide .v_txt > div span.tit {padding: 8px 20px;margin-right: 5px;border-radius: 50px;font-size: 15px;color: #fff;} #visual .m_visual .v_guide .v_txt > div.receipt span.tit {background-color: #3e53d1;} #visual .m_visual .v_guide .v_txt > div.race span.tit {background-color: #e0474b;} #visual .m_visual .v_img .btn_pick {line-height: 45px;width: 320px;padding: 5px;height: 60px;font-size: 25px;font-weight: 500;text-align: center;color: #6d6d6d;background-color: #fff;border-radius: 35px;} #visual .m_visual .v_img .pop {/*max-width: 650px;min-height: 410px;*/padding: 20px;color: #fff;border-radius:30px;background-color: var(--mainPop);background-repeat: no-repeat;background-image: url(../_img/main_pop_book.png);background-position: 100% 100%;background-size: 30%;} #visual .m_visual .v_img .pop .btn {margin-top:20px;} #visual .m_visual .v_img .tit {padding: 0px;color: #fff;font-size: 30px;font-weight: 700;background-color: var(--mainPop);} #visual .m_visual .v_img .day {display: flex;margin: 10px 0px;color: #fff;font-size: 17px;background-color: var(--mainPop);flex-wrap: wrap;} #visual .m_visual .v_img .p9872 {font-size: 25px;margin-right:10px;} #visual .m_visual .v_img .dc_seq {font-size:14px;} #visual .m_visual .v_img .course_list {display: flex;flex-wrap: wrap;} #visual .m_visual .v_img .course_list > li {overflow: hidden;width: calc(50% - 20px);font-size: 18px;margin: 0px;border-radius: 10px;text-align: left;background-repeat: no-repeat;} /* #visual .m_visual .v_img .course_list > li:first-child {background-image: url(../_img/ico_select_person1.png);background-position: calc(100% - 10px) 100%;background-size: auto 225px;} #visual .m_visual .v_img .course_list > li:last-child {background-image: url(../_img/ico_select_person2.png);background-position: calc(100% - 20px) 100%;background-size: auto 180px;} */ #visual .m_visual .v_img .course_list > li:nth-child(-n+2) {margin-top: 0;} #visual .m_visual .v_img .course_list > li:nth-child(2n-1) {margin-left: 0;} #visual .m_visual .v_img .course_list > li:nth-child(2n) {margin-right: 0;} /* #section1 */ #section1 {padding: 50px 0 20px;background-color: #eee;} #section1 .m_direct {margin-bottom: 50px;} #section1 .m_direct > ul {display: flex;flex-wrap: wrap;} #section1 .m_direct > ul > li {width: 48%;margin: 1%;text-align: center;} #section1 .m_direct > ul > li > a {display: block;padding: 20px 15px;font-size: 16px;font-weight: 700;color: #420d64;background-color: #fff;border-radius: 20px;box-shadow: 7px 7px 20px rgba(0,0,0,0.07);} /*#section1 .m_direct > ul > li.direct1 > a {background-color: #3e53d1;} #section1 .m_direct > ul > li.direct2 > a {background-color: #dc4649;} #section1 .m_direct > ul > li.direct3 > a {background-color: #7e8ef0;} #section1 .m_direct > ul > li.direct4 > a {background-color: #3e53d1;} #section1 .m_direct > ul > li.direct5 > a {background-color: #47aa8b;}*/ #section1 .m_direct > ul > li > a::before {content: '';display: block;height: 40px;margin-bottom: 10px;background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 100%;} #section1 .m_direct > ul > li.direct1 > a::before {background-image: url(../_img/ico_m_direct1.png?v=1);} #section1 .m_direct > ul > li.direct2 > a::before {background-image: url(../_img/ico_m_direct2.png?v=1);} #section1 .m_direct > ul > li.direct3 > a::before {background-image: url(../_img/ico_m_direct3.png?v=1);} #section1 .m_direct > ul > li.direct4 > a::before {background-image: url(../_img/ico_m_direct4.png?v=1);} #section1 .m_direct > ul > li.direct5 > a::before {background-image: url(../_img/ico_m_direct5.png?v=1);} #section1 .my_race {} #section1 .my_race .title_wp {} /*#section1 .my_race .title_wp::after {content: '';position: absolute;bottom: -55px;left: -15px;width: 140px;height: 155px;background-image: url(../_img/ico_m_my_title.png);background-repeat: no-repeat;background-position: 0 100%;background-size: auto 100%;}*/ #section1 .my_race .track_wp {position: relative;padding: 110px 30px 80px 70px;background-image: url(../_img/ico_m_my_track.png);background-repeat: no-repeat;background-position: 50% 68px;} #section1 .my_race .track_wp .start, #section1 .my_race .track_wp .finish {position: absolute;background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999px;} #section1 .my_race .track_wp .start {top: 15px;left: 0;width: 110px;height: 105px;background-image: url(../_img/ico_m_my_start.png?v=1);background-size: 100% auto;} #section1 .my_race .track_wp .finish {top: -10px;right: -10px;width: 80px;height: 120px;background-image: url(../_img/ico_m_my_finish.png?v=1);background-size: 100% auto;} #section1 .my_race .track_wp .finish.end {display: none;} #section1 .my_race .track_wp .track {position: relative;z-index: 10;width: 100%;height: 11px;border-radius: 6px;background-color: #acaaeb;} #section1 .my_race .track_wp .track::before {content: '';} #section1 .my_race .track_wp .track > span {position: absolute;display: inline-block;padding-top: 25px;text-align: center;font-size: 12px;font-weight: 700;color: #000;line-height: 1.2em;transform: translateX(-50%);} #section1 .my_race .track_wp .track > span::before {content: '';position: absolute;top: -1px;left: 50%;z-index: 2;width: 13px;height: 13px;margin-left: -6px;background-color: #fff;border-radius: 50%;} #section1 .my_race .track_wp .track > span.step0 {color: rgba(0,0,0,0.4);} #section1 .my_race .track_wp .track > span.step0::after {content: '';position: absolute;top: 0;left: 0;z-index: 1;width: 15px;height: 12px;background-color: #eee;} #section1 .my_race .track_wp .track > span.me {position: absolute;display: inline-block;padding: 25px 0 30px;text-align: center;font-size: 13px;font-weight: 700;color: #fff;line-height: 1.2em;transform: translateX(-50%);} #section1 .my_race .track_wp .track > span.me::before {content: '';position: absolute;top: -1px;left: 50%;z-index: 2;width: 13px;height: 13px;margin-left: -6px;background-color: #fff;border-radius: 50%;} #section1 .my_race .track_wp .track > span.me::after {content: '';position: absolute;top: -100%;left: 50%;z-index: 9;width: 65px;height: 60px;/*background-image: url(../_img/ico_man_run.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-90%);background-size: auto 100%;*/} #section1 .my_race .track_wp .track > span.me.end::after {top: -135px;height: 130px;background-image: url(../_img/ico_man_finish.png);} /* #section2 */ #section2 .section_inner {padding: 60px 0;} #section2 h3 {position: relative;margin-bottom: 25px;} #section2 h3 a.more {position: absolute;top: 10px;right: 0;width: 20px;height: 20px;background-image: url(../_img/ico_m_more.png);background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999em;} #section2 .section_inner > div + div {margin-top: 50px;} #section2 .graph_wp .graph {height: calc(100% - 75px);} #section2 .graph_wp .graph > div {display: flex;width: 100%;height: 50px;justify-content: space-between;flex-wrap: wrap;} #section2 .graph_wp .graph > div > span {vertical-align: middle;} #section2 .graph_wp .graph > div > span.tit {width: 80px;font-size: 15px;font-weight: 700;} #section2 .graph_wp .graph > div > span.con {position: relative;z-index: 0;width: calc(78% - 80px);height: 30px;text-align: left;} #section2 .graph_wp .graph > div > span.con > span {position: absolute;top: 50%;left: 0;z-index: -1;min-width: 2px;max-width: 100%;height: 30px;margin-top: -15px;background-color: #3db08b;} #section2 .graph_wp .graph > div > span.num {width: 21%;text-align: right;font-size: 13px;} #section2 .notice_wp .notice ul > li + li {margin-top: 20px;} #section2 .notice_wp .notice ul > li > a {overflow: hidden;display: block;text-overflow: ellipsis;white-space: nowrap;font-size: 15px;color: #000;} #section2 .notice_wp .notice ul > li > span.date {display: block;margin-top: 3px;font-size: 13px;color: #757575;} #section2 .section_inner .m_history {position: relative;width: 100%;padding-right: 5px;} #section2 .section_inner .m_history::before {content: '';position: absolute;right: -15px;bottom: 0;width: 140px;height: 100%;background-image: url(../_img/ico_m_history.png);background-repeat: no-repeat;background-position: 100% 100%;background-size: 100% auto;} #section2 .section_inner .m_history > div {padding: 30px 130px 30px 30px;background-color: #f4f4f4;border-radius: 30px;} #section2 .section_inner .m_history > div h3, #section2 .section_inner .m_history > div .slider {vertical-align: top;} #section2 .section_inner .m_history > div .slider .slick-list {overflow: hidden;} #section2 .section_inner .m_history > div .slider li {padding: 10px 0;} #section2 .section_inner .m_history > div h3 {margin-bottom: 15px;} #section2 .section_inner .m_history > div h3 {font-size: 23px;} #section2 .section_inner .m_history > div .slider li span {display: block;font-size: 15px;font-weight: 400;color: #000;vertical-align: middle;} #section2 .section_inner .m_history > div .slider li span.kind {margin-bottom: 7px;width: 57px;height: 24px;margin-right: 10px;border-radius: 12px;text-align: center;background-color: #dc4649;color: #fff;font-size: 13px;font-weight: 500;line-height: 24px;text-transform: uppercase;} #section2 .section_inner .m_history > div .slider li span.con {width: 100%;} #section2 .section_inner .m_history > div .slider li span.date {margin-top: 7px;font-size: 13px;color: #757575;} #section2 .section_inner .m_qna {} #section2 .section_inner .m_qna > a {display: block;padding-right: 60px;background-image: url(../_img/ico_m_qna.png);background-repeat: no-repeat;background-position: 100% 0;background-size: auto 50px;} #section2 .section_inner .m_qna > a .tit {display: block;font-size: 20px;font-weight: 700;color: #000;line-height: 1.2em;} #section2 .section_inner .m_qna > a .btn {display: inline-block;height: 45px;margin-top: 20px;padding: 0 25px !important;font-size: 14px !important;font-weight: 500;color: #fff;background-color: #631992;line-height: 45px;border-radius: 45px;} /**/ #section3 h3 {margin-bottom: 15px;} #section3 .hall_wp {display: flex;flex-wrap: wrap;} #section3 .hall_wp > div {position: relative;width: 46%;margin: 15px 2%;padding: 20px 15px;margin-top: 35px;background-color: #eee9f2;border-radius: 50px;text-align: center;} #section3 .hall_wp > div::before {content: '';position: absolute;top: -35px;left: 50%;width: 100%;height: 60px;background-image: url(../_img/ico_rank.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-50%);} #section3 .hall_wp p.title {margin-bottom: 15px;padding: 8px 0;background-color: #6da221;font-size: 15px;font-weight: 500;color: #fff;border-radius: 50px;} #section3 .hall_wp .list > li {font-size: 16px;font-weight: 500;color: #000;} #section3 .hall_wp .list > li + li {margin-top: 5px;} #section3 .hall_wp .list > li > span {display: inline-block;vertical-align: middle;} #section3 .hall_wp .list > li > span.num {margin: 0 10px 0 -10px;width: 24px;height: 23px;font-size: 13px;line-height: 24px;background-image: url(../_img/shape_rank_list.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 100%;} /**/ #footer {} #footer .f_left .f_logo img {height: 32px;} #footer .f_left .f_link {margin: 15px 0;} #footer .f_left address {font-size: 15px;} #footer .f_left address > span {display: block;} #footer .f_left address > span + span {margin: 3px 0 0;} #footer .f_left cite {display: block;margin-top: 10px;font-size: 15px;} #footer .f_right .web_count > span {display: block;font-size: 15px;} #footer .f_right .web_count > span + span {margin: 3px 0 0;} /**/ #contain #subVisual .sub_visual .visual_wp {display: table;width: 100%;width: 95%;height: 200px;margin: 0 auto;padding-left: 0;} #contain #subVisual .sub_visual .visual_wp .visual {display: table-cell;vertical-align: middle;} #contain #subVisual .sub_visual .visual_wp .visual h2 {font-size: 34px;font-weight: 500;color: #fff;text-align: center;} #contain #subVisual .sub_visual .visual_wp .visual .locator {margin-top: 10px;} #contain #subVisual .sub_visual .visual_wp .visual .locator > ul {width: 95%;margin: 0 auto;text-align: center;} #contain #subVisual .sub_visual .visual_wp .visual .locator > ul::after {content: '';display: block;clear: both;} #contain #subVisual .sub_visual .visual_wp .visual .locator > ul > li {display: inline-block;vertical-align: middle;} #contain #subVisual .sub_visual .visual_wp .visual .locator > ul > li.home {width: auto;} #contain #subVisual .sub_visual .visual_wp .visual .locator > ul > li > a, #contain #subVisual .sub_visual .visual_wp .visual .locator > ul > li > button {font-size: 16px;font-weight: 400;color: #fff;font-family: inherit;background-color: transparent;vertical-align: middle;} /**/ #design {float: none;width: 100%;} /**/ #aside {float: none;display: none;} /**/ #contain #subVisual {height: 280px;padding-top: 60px;} #contain #subVisual .sub_visual {text-align: left;} #contain #subVisual .sub_visual::before {width: 100%;height: 100px;background-size: auto 100%;} #contain #subVisual .sub_visual h3 {padding-top: 30px;text-align: left;font-size: 30px;} #contain #subVisual .sub_visual .ticket_marathon {top: 50%;margin-top: -75px;} } @media all and (max-width: 999px) { /**/ #mainCon {width: 100%;} #section0 .v_quick {display: inline-block;width: 95%;font-size: 0;text-align: center;} #section0 .v_quick ul::after {content: '';display: block;clear: both;} #section0 .v_quick ul > li {display: inline-block;width: 30%;margin: 15px 2%;} #section0 .v_quick ul > li:nth-child(3n-2) {margin-left: 0;} #section0 .v_quick ul > li:nth-child(3n) {margin-right: 0;} #section0 .v_quick ul > li > a {display: block;padding: 0;font-size: 15px;font-weight: 400;color: #fff;} #section0 .v_quick ul > li > a .icon {display: block;height: 90px;background-repeat: no-repeat;background-position: 50% 50%;} #section0 .v_quick ul > li.quick6 > a .icon {width: 100%;background-size: auto 60px;} /**/ #foot_section .f_lib > ul {display: block;max-width: none;padding: 0;} #foot_section .f_lib > ul > li + li {margin-top: 12px;} #foot_section .f_lib > ul + ul {margin-top: 12px;} #foot_section .site_info {margin-top: 30px;} /* #contain #subVisual {height: 260px;} #contain #subVisual .sub_visual::after {content: '';position: absolute;top: 110px;right: -15%;width: 530px;height: 300px;background-image: url(../_img/bg_sub_contents.png);background-repeat: no-repeat;background-position: 100% 50%;background-size: auto 100%;}*/ } @media all and (max-width: 949px) { #visual .section_inner {flex-wrap: wrap;} #visual .m_visual .v_img {flex-basis: 100%;padding: 0;} #visual .m_visual .v_img a img {width: 100%;} } @media all and (max-width: 767px) { /**/ #poplayer{position:absolute;z-index:1000;top:120px;left:50%;margin:0 0 0 -150px;width:300px;cursor:move} img{width:auto;max-width:100%;height:auto !important;} #OpenLayer {position: absolute;top: 150px;left: 10px;width: 70%;z-index: 9999;background: #fff;padding: 5px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 12px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} #OpenLayer img {width: 100%;} html.fp-enabled, .fp-enabled body {overflow: visible;} /* header */ #header {overflow: hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;height: 60px !important;padding: 0;} #header::before {content: '';position: absolute;top: 59px;width: 100%;height: 1px;background-color: rgba(0,0,0,0.1);} #header .header {position: relative;height: 60px;padding: 0;margin: 0 auto;} #header .header::after {content: '';display: block;clear: both;} #header h1 {position: absolute;top: 0;left: 0;width: 100%;padding-left: 60px;max-width: none;} #header h1 a {display: block;width: 100%;height: 60px;background-image: url(../_img/logo.png?v=1);background-repeat: no-repeat;background-position: 0 50%;background-size: auto 28px;text-indent: -9999px;} #header.header_active h1 a, #header.bg_white h1 a {background-image: url(../_img/logo_on.png);} #header button.btn-menu {position:absolute;top: 0;left: 0;z-index: 10;width: 60px;height: 60px;padding: 0 !important;background: url(../_img/ico_menu.png) no-repeat;background-position: calc(100% - 15px) 50%;} #header.bg_white button.btn-menu {background-image: url(../_img/ico_menu_on.png);} #header button.btn-menu i{display: none !important;font-size:24px !important;color: #000;} #header button.btn-page{height:40px;width:40px;text-align:center;top:36px;right:10px;display:block;line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page2{height:40px;width:48px;text-align:center;top:36px;right:55px;display:block; line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page i{display:block !important;padding:5px 0 0 0;height:20px;font-size:18px !important; } /**/ /*#fullpage .section {min-height: auto;height: auto !important;}*/ .section h3 {font-size: 21px;font-weight: 500;color: #333;} .section h3.white {color: #fff;} .section .kind {width: 80px;height: 24px;text-align: center;font-size: 12px;line-height: 24px;font-weight: 500;color: #fff;} .section .kind.lib1 {background-color: #7000b7;} .section .kind.lib2 {background-color: #00a54c;} .section .kind.lib3 {background-color: #003fe0;} .section .kind.lib4 {background-color: #fb612b;} .section .btn_wrap {margin-top: 30px;text-align: center;} .section .btn_wrap > a {display: inline-block;min-width: 150px;height: 48px;border: 1px solid #333;font-size: 15px;font-weight: 400;color: #333;line-height: 48px;} /**/ #mainCon {width: 100%;padding-bottom: 60px;} #mainCon section .section_inner {width: 94%;margin: 0 auto;} #mainCon section .section_inner h3 {font-size: 22px;font-weight: 700;color: #000;} #mainCon section .section_inner h3.white {color: #fff;} #mainCon section .section_inner .sub_tit { font-size: 14px; color: #3f3f3f; position: relative; padding: 0 0 7px 10px;} /**/ #footer {padding: 30px 0 40px;background-color: #333;} #footer .footer {position: relative;width: 94%;margin: 0 auto;} #footer .f_left .f_logo img {max-width: 90%;max-height: 28px;} #footer .f_left .f_link {margin: 15px 0;} #footer .f_left .f_link > a {font-size: 15px;color: #fff;font-weight: 400;} #footer .f_left .f_link > a.privacy {color: #daa0fe;} #footer .f_left .f_link > a + a {margin-left: 20px} #footer .f_left address {font-size: 14px;color: #fff;line-height: 1.5em;font-style: normal;} #footer .f_left address .addr {margin-bottom: 7px;} #footer .f_left address .tel > span {display: block;} #footer .f_left address > span + span {margin-top: 3px;} #footer .f_left address > span strong {font-weight: 700;} #footer .f_left cite {font-style: normal;font-size: 14px;color: #fff;} #footer .f_right .go_top {position: absolute;bottom: 0;right: 0;} #footer .f_right .go_top > button {width: 55px;height: 55px;border-radius: 20px;background-color: #34b574;background-image: url(../_img/ico_w_top_arrow.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 20px;text-indent: -9999px;} #footer .f_right .web_count {width: calc(100% - 70px);padding: 15px 20px 15px 0;margin-top: 20px;background-color: #fff;border-radius: 20px;} #footer .f_right .web_count > span {display: inline-block;margin: 2px 0 2px 20px;font-size: 14px;color: #fff;} #footer .f_right .web_count > span + span {margin: 2px 0 2px 20px;} /* 서브비주얼 */ #contain #subVisual {width: 100%;height: auto;padding-top: 60px;background-color: #f1f6ff;background-image: url(../_img/bg_visual.jpg);background-repeat: no-repeat;background-position: 80% 100%;background-size: cover;} #contain #subVisual .sub_visual {position: relative;width: 94%;height: calc(100% - 30px);margin: 30px auto 0;padding-bottom: 200px;} #contain #subVisual .sub_visual h3 {padding-top: 0;margin-bottom: 0;font-size: 26px;font-weight: 700;color: #000;} #contain #subVisual .sub_visual .locator {margin-top: 5px;} #contain #subVisual .sub_visual .locator > ul > li {display: inline-block;vertical-align: middle;} #contain #subVisual .sub_visual .locator > ul > li a, #contain #subVisual .sub_visual .locator > ul > li span, #contain #subVisual .sub_visual .locator > ul > li button {display: block;font-size: 15px;font-weight: 400;color: #000;font-family: inherit;background-color: transparent;} #contain #subVisual .sub_visual .locator > ul > li button::before, #contain #subVisual .sub_visual .locator > ul > li span::before {content: '>';display: inline-block;width: 20px;vertical-align: top;text-align: center;font-size: inherit;font-family: inherit;} #contain #subVisual .sub_visual .locator .navi {display: none;} #contain #subVisual .sub_visual::before {content: '';position: absolute;bottom: -10px;left: 0;width: 103%;z-index: 2;height: 75px;background-image: url(../_img/ico_sub_visual.png);background-repeat: no-repeat;background-position: 0 100%;background-size: auto 100%;} #contain #subVisual .sub_visual .ticket_marathon {position: absolute;top: auto;bottom: 50px;right: 0;z-index: 1;width: 260px;height: 135px;padding: 15px 20px;margin: 0;background-image: url(../_img/shape_ticket.png);background-repeat: no-repeat;background-position: 0 50%;background-size: auto 100%;} #contain #subVisual .sub_visual .ticket_marathon > p {display: flex;text-align: left;align-items: flex-end;} #contain #subVisual .sub_visual .ticket_marathon > p span {font-size: 15px;font-weight: 500;color: #fff;} #contain #subVisual .sub_visual .ticket_marathon > p strong {margin-left: 10px;font-size: 45px;font-weight: 500;color: #ff5b5e;line-height: 1;} #contain #subVisual .sub_visual .ticket_marathon a.btn {display: block;width: 90%;margin-top: 15px;padding: 10px 20px;background-color: #38448a;font-size: 16px;font-weight: 500;color: #fff;background-image: url(../_img/ico_w_arrow.png);background-repeat: no-repeat;background-position: calc(100% - 20px) 50%;text-align: left;border-radius: 100px;} /* #design */ #design {position: relative;width: 94%;margin: 30px auto 70px;} #aside {display: none;} /**/ #blind{position:absolute;z-index: 49999;top:0px;left:0px; bottom:0;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft{display:none;position:fixed;z-index:100 !important;left:0px;top:0px;max-width: 320px;width: 80%;height: 100%;background:#1e2c5d;padding-bottom: 105px;} #dkleft .lefttit{padding: 15px;text-align:left;width: 100%;box-sizing: border-box;background:#1e2c5d;} #dkleft .lefttit img{height: 25px;} #dkleft .select {border-top: 5px double rgba(255,255,255,0.3);height: 100%;overflow-y: auto;} /*#dkleft .lefttit button {display:block;padding: 7px 20px;background-color: #fff;color: #000;font-family: inherit;border-radius: 10px;font-size: 15px;} #dkleft .lefttit button i {display: inline-block;padding: 0 7px 0 0;font-size: 15px;color:#fff;vertical-align: middle;}*/ #dkleft .lefttit a.log_btn {display:block;max-width: calc(100% - 100px);} #dkleft .lefttit a.log_btn > span {display: inline-block;padding: 7px 15px;background-color: #fff;color: #000;font-family: inherit;border-radius: 10px;font-size: 14px;} #dkleft .lefttit a.go_lib {display: inline-block;margin-top: 5px;padding: 7px 15px;border-radius: 10px;border: 1px solid #fff;color: #fff;font-size: 14px;} #dkleft .lefttit > div {background-color: #eee;padding: 0 15px;} #dkleft .lefttit .join{display:inline-block;position:relative;padding:0 10px;height:36px;line-height:36px;margin:5px 0;font-size:15px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .lefttit .join i{padding:0 7px 0 0;font-size:24px;color:#1e2c5d} #dkleft .lefttit .idpw{display:inline-block;position:relative;padding:0 10px;height:36px;line-height:36px;margin:5px 0;font-size:15px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .lefttit .sel_btn {display:inline-block;position:relative;padding:0 8px;height:36px;line-height:36px;margin:5px 0;font-size:14px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .lefttit .mobile_member {display: block;padding-bottom: 5px;border-top: 1px solid rgba(255,255,255,0.3);} #dkleft .lefttit .mobile_member > a {display: block;padding: 10px 0 10px 35px;color: #fff;font-size: 15px;box-sizing: border-box;background: url(../_img/member_icon.png) no-repeat 0 50%;} #dkleft .select .modify{display:block;position:relative;padding:0 17px;line-height:45px;font-size:16px;color:#000;border-bottom:1px solid #ccc;background:#eee;transition:all 0.2s ease-out 0s;} #dkleft .select .modify span {display:inline-block;padding:0 16px;height:36px;line-height:36px;background:#2e4287;color:#fff;border-radius:5px;} #dkleft .select .modify i{display:inline-block;position:relative;top:1px;padding:0 7px 0 0;font-size:24px;color:#fff} #dkleft .depth1 {overflow: hidden;display:block;width: 100%;position:relative;padding: 0 15px;line-height:50px;font-size:16px;color:#fff;text-align:left;border-bottom: 1px solid rgba(255, 255, 255, .1);transition:all 0.2s ease-out 0s;background-color: transparent;} #dkleft .depth1 strong{position:relative;top:-2px;padding:0 4px;height:14px;line-height:14px;font-size:10px;background:#ff0000;border-radius:30px} #dkleft .depth1 span{font-style:normal;color:#ffa800} #dkleft .depth1 em{position:absolute;z-index:2;top:0;right:4px;width:39px;height:39px;background:url(/web/seomun/_img/common/plus.png) no-repeat 50% 50%;background-size:11px 11px} #dkleft .depth1.sel{background: #2e4287;color:#fff;border-bottom:1px solid #596170} #dkleft .depth1 i {display:block;width: 20px;height: 20px;margin: 15px 0 0 0;background-image: url(../_img/ico_dkleft_arrow.png);background-size: auto 7px;text-indent: -9999px;background-repeat: no-repeat;background-position: 50% 50%;transition:all 0.2s ease-out 0s;} #dkleft .depth1 i.rightico {float:right} #dkleft .depth1.sel i.rightico {color:#fff;transform:rotate(180deg);transition:all 0.2s ease-in-out 0s;} #dkleft .depth2{display:none;background:#fff} #dkleft .depth2 a{display:block;padding:0 20px;line-height:40px;font-size:14px;color:#555;border-bottom:1px solid #ddd;text-decoration:none} #dkleft .depth2 a.sel{color:#81c341} #dkleft .depth2 .depth3 {background-color: #f4f4f4;} #dkleft .depth2 .depth3 > li > a {display: block;font-size: 13px;padding: 7px 20px;color: #555;border-bottom: 0;line-height: 1.2em;} #dkleft .depth2 .depth3 > li:first-child > a {padding-top: 15px;} #dkleft .depth2 .depth3 > li:last-child > a {padding-bottom: 15px;border-bottom: 1px solid #ddd;} /*#closeleft{position: absolute;z-index: 9999999;left: -45px;top: 15px;width: 35px;height: 35px;display: block;text-align: center;font-size: 30px;font-family: Linearicons-Free;speak: none;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;text-indent: -9999px;line-height: 1;color: #fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*/ #closeleft{position: absolute;z-index: 9999999;right: 5px;top: 5px;width: 50px;height: 50px;display: block;text-align: center;font-size: 30px;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;color: #fff;background-image: url(../_img/wclose.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: auto 25px;} /*#closeleft:before{content:"\e870";font-size:30px;line-height:1;}*/ #gotop{position:fixed;z-index: 10000;bottom:0px;right:0px;display:none} #gotop a{display:block;width: 54px;height: 60px;padding: 32px 0 0 0;font-size:10px;font-weight:800;text-align:center;color:#fff;background:rgba(0,0,0,0.3) url(../_img/gotop.png) no-repeat 50% 32%;border-radius:0px;overflow:hidden} } @media all and (max-width: 599px) { /**/ #visual {background-position: 0 100%;} #visual .m_visual .v_guide {padding-bottom: 80px;} #visual .m_visual::before {bottom: -10px;height: 70px;background-position: 100% 100%;} #visual .m_visual::after {left: 0;right: auto;bottom: -10px;height: 60px;} #visual .m_visual .v_guide .v_txt {display: block;} #visual .m_visual .v_guide .v_txt > div {display: block;} #visual .m_visual .v_guide .v_txt > div.race {margin-top: 2px;} } @media all and (max-width: 399px) { /**/ #header h1 a {background-size: auto 25px;} /**/ #visual .m_visual .v_guide .v_date {flex-wrap: wrap;} #visual .m_visual .v_guide .v_date > span {font-size: 16px;} #visual .m_visual .v_guide .v_date > span .line {display: inline;} #visual .m_visual .v_guide .v_date > span.date {width: 100%;font-size: 45px;margin: 5px 0 0 0;} #visual .m_visual .v_guide .v_txt > div span {font-size: 15px;} #visual .m_visual .v_guide .v_txt > div span.tit {font-size: 13px;} /**/ #section1 .m_direct > ul > li {width: 100%;margin: 2% 0;} #section1 .my_race .track_wp {position: relative;padding: 110px 5vw 80px 7vw;background-image: url(../_img/ico_m_my_track.png);background-repeat: no-repeat;background-position: 50% 68px;} #section1 .my_race .track_wp .start {top: 25px;left: 0;width: 45px;height: 105px;background-image: url(../_img/ico_m_my_start.png);background-size: auto 50px;} #section1 .my_race .track_wp .finish {top: 0;right: 0;width: 58px;height: 120px;background-image: url(../_img/ico_m_my_finish.png);background-size: 100% auto;} #section1 .my_race .track_wp .track {height: 8px;} #section1 .my_race .track_wp .track > span {padding-top: 15px;font-size: 0;} #section1 .my_race .track_wp .track > span::before {width: 10px;height: 10px;} #section1 .my_race .track_wp .track > span.step0::after {width: 8px;} #section1 .my_race .track_wp .track > span.me {z-index: 5;padding: 15px 0 30px;font-size: 12px;} #section1 .my_race .track_wp .track > span.me::before {width: 10px;height: 10px;} #section1 .my_race .track_wp .track > span.me::after {content: '';position: absolute;top: -100%;left: 50%;z-index: 9;width: 55px;height: 50px;background-image: url(../_img/ico_man_run.png);background-repeat: no-repeat;background-position: 50% 100%;transform: translateX(-90%);background-size: auto 100%;} #section1 .my_race .track_wp .track > span.me.end::after {top: -90px;height: 85px;} /**/ #section2 .graph_wp .graph > div {height: auto;} #section2 .graph_wp .graph > div + div {margin-top: 15px;} #section2 .graph_wp .graph > div > span.tit {flex: 0 0 80px;font-size: 15px;font-weight: 700;} #section2 .graph_wp .graph > div > span.con {width: calc(100% - 80px);height: 30px;text-align: left;} #section2 .graph_wp .graph > div > span.con > span {position: absolute;top: 50%;left: 0;z-index: -1;min-width: 2px;max-width: 100%;height: 30px;margin-top: -15px;background-color: #3db08b;} #section2 .graph_wp .graph > div > span.num {width: calc(100% - 80px);margin: 5px 0 0 80px;text-align: left;} #section2 .section_inner .m_history::before {display: none;} #section2 .section_inner .m_history > div {padding: 20px 25px;border-radius: 20px;} /**/ #section3 .hall_wp > div {width: 100%;margin: 15px 0;margin-top: 35px;} } @media (max-width: 320px) { #Wrap {min-width: 100vw;height: 100vw;} /**/ #header h1 a {background-size: auto 22px;} }