@charset "utf-8"; .faq .sortingArea label {margin-right: 16px; } .faq .sortingArea.type01 {margin-top: 7px; } .faq .board-head .srch-box .inp-srch {width: 340px; } .faqArea li a.question {font-size: 22px;line-height: 36px; } .faqArea li a.question i {font-size: 25px;color: #777777; } .faqArea li.current a.question i {top: calc(50% - 25px);right: 14px;width: 50px;height: 50px;border-radius: 100%;background: #00939b;color: #fff;line-height: 50px;text-align: center; } .answer::after {clear:both;display:block;content:''; } .answerMark {float:left;width:50px;color: #00939b;font-size: 25px;font-weight: 700; } .answerTxt {float:left;width:calc(100% - 50px); } .pageNation {display: flex;justify-content: center;margin-top: 60px; } .pageNation .prev, .pageNation .next {font-size: 22px;color: #777777; } .pageNation .paging {display: flex; } .pageNation .paging li {display: flex;width: 26px;margin: 0 12px;align-items: center;justify-content: center;} .pageNation .paging li a {font-weight: 500;color: #777777;font-size: 22px; } .pageNation .paging li.current a {display: inline-block;width: 26px;text-align: center;color: #00939b;font-weight: 700;border-bottom: 2px solid #00939b; } .grayBox {display: flex;padding: 75px;background-color: #f9f9f9; margin-bottom:40px; } .inquire .grayBox h3 {width: 35%;margin-top: 10px;font-size: 30px;font-weight: 700; } .inquire .grayBox .subDesc, .reservation .grayBox .subDesc {width: 65%;font-size: 20px;line-height: 45px;text-align: left; } .inquire .grayBox .subDesc ul li:before, .reservation .grayBox .subDesc ul li:before {content: '※';padding-right: 8px;/*color: #00939b; */} .inquire .btnArea {margin-top: 65px; } .inquire .board-head .left {font-size: 20px; } .inquire .board-head.borderBottom {margin-bottom: 45px;padding-bottom: 25px; } .inquire .agreementArea {margin-bottom: 40px; } .inquire .agreementArea p.typeBlock {margin-bottom: 0; } .inquire .agreementArea .agreeTit {display: flex;align-items: center;margin-bottom: 22px;justify-content: space-between;} .inquire .agreementArea .agreeTit .agreeArea {} .inquire .agreementArea .agreeBox {overflow: auto;height: 134px;max-height: 134px;padding: 30px 40px;border: 1px solid #d7d7d7;font-size: 16px;line-height: 30px;color: #5d5d5d; } .inquire .agreeArea.allCheck {margin-top: -20px; } .inquire .agreementArea .agreeBox::-webkit-scrollbar {width: 10px; } .inquire .agreementArea .agreeBox::-webkit-scrollbar-track {background-color: #ececec; } .inquire .agreementArea .agreeBox::-webkit-scrollbar-thumb {border-radius: 10px;background-color: #838383; } .inquire .agreementArea .agreeBox::-webkit-scrollbar-button {width: 0;height: 0; } /* Firefox scrollbar */ .inquire .agreementArea .agreeBox {scrollbar-width: thin;scrollbar-color: #838383 transparent; } .lostArticle .grayBox {display: block; } .lostArticle .grayBox .desc {display: flex;justify-content: space-between;align-items: center; } .lostArticle .grayBox .desc p {font-size: 20px;line-height: 32px; } .lostArticle .grayBox .desc p strong {color: #00939b;font-weight: 500; } .lostArticle .inputArea {padding: 70px 0 60px; } .lostArticle .formLayout > li.datePickerStyle {display: flex;justify-content: space-between;align-items: center; } .lostArticle .formLayout > li.datePickerStyle .dateArea {flex-basis: 50%; } .lostArticle .formLayout > li.datePickerStyle .dateArea input {position:relative;z-index:1;background-color:transparent; } .lostArticle .formLayout > li.datePickerStyle .dateArea input::-ms-clear { display: none; } .lostArticle .formLayout > li.datePickerStyle span {margin: 0 2%;font-size: 20px; } .tblArea .tblType.col { } .tblArea .tblType.col th, .tblArea .tblType.col td {text-align: center; } .tblArea.lostTbl .tblType.col th, .tblArea.lostTbl .tblType.col td {vertical-align:middle; } .tblArea .tblType.col th {font-size: 22px; } .tblArea .tblType.col td {font-size: 20px;font-weight: 400; } .lostArticle .tblArea .tblType.col tr td:nth-child(3) {color: #00939b; } .lostArticle .tblArea .tblType.col tr td:nth-child(5) {color: #838383; } .lostArticle .modal-container {padding: 50px;background: #fff; } .lostArticle .modal-container .tit {display: block;margin-bottom: 25px;font-size: 25px;font-weight: 700; } .lostArticle .modal-container .tit:last-child {margin-top: 50px; } .lostArticle .modal-container .grayBox {padding: 50px 50px 40px 50px;text-align: center; } .lostArticle .modal-container .grayBox em {font-size: 20px;font-weight: 700;color: #ff7153; } .lostArticle .modal-container .grayBox p {padding-top: 15px;font-size: 17px;word-break:keep-all; } .lostArticle .modal-container .grayBox ol {overflow: hidden;padding-top: 93px;margin: auto; } .lostArticle .modal-container .grayBox li {float: left; } .lostArticle .modal-container .grayBoxBg01 {margin-bottom: 50px;background: #f9f9f9 url("../images/customer_service/img_layer001.png") no-repeat center 50px; } .lostArticle .modal-container .grayBoxBg01 li {margin: 0 42px; } .lostArticle .modal-container .grayBoxBg02 {position: relative;background: #f9f9f9 url("../images/customer_service/img_layer002.png") no-repeat center 50px;height: 222px;padding: 0; } .lostArticle .modal-container .grayBoxBg02 li {position: absolute;top: 138px; } .lostArticle .modal-container .grayBoxBg02 li:nth-child(1) {left: 48px; } .lostArticle .modal-container .grayBoxBg02 li:nth-child(2) {left: 192px; } .lostArticle .modal-container .grayBoxBg02 li:nth-child(3) {left: 354px; } .lostArticle .modal-container .grayBoxBg02 li:nth-child(4) {left: 520px; } .container.reservation, .container.reservation .containerInner {width: 100%;/*max-width: unset; */ max-width: 100%;padding-top: 0; } .container.reservation .inner {position: relative; } .container.reservation .inner .imgApp {position: absolute;left: 0;top: 100px; } .container.reservation .w100 {background: #ff7153; } .container.reservation .contentsInner {max-width: 1400px;margin: auto;} .container.reservation .contentsInner .topSection {text-align: center;color: #fff; } .container.reservation .contentsInner .topSection .titleArea span {font-size: 20px;font-weight: 200; } .container.reservation .contentsInner .topSection .titleArea h3 {margin-top: 15px;font-weight: 700;font-size: 45px; } .container.reservation .contentsInner .topSection .titleArea h3 span {display: inline-block;height: 36px;padding: 4px;font-weight: 700;font-size: 45px;color: #ff7153;background-color: #ffdd60; } .container.reservation .contentsInner .topSection .subDesc01 {margin-top: 65px; } .container.reservation .contentsInner .topSection .subDesc01 li {height: 37px;margin-top: 20px;font-size: 25px;font-weight: 400;line-height: 37px; } .container.reservation .contentsInner .topSection .subDesc01 li span {display: inline-block;padding-left:5px;/*background: url("../images/customer_service/bg_subdesc01.svg") no-repeat left center; */} .container.reservation .contentsInner .topSection .subDesc02 ul {display: flex;justify-content: center;margin-top: 65px;padding-bottom: 120px; } .container.reservation .contentsInner .topSection .subDesc02 li {padding-top: 93px;position:relative;text-align:center; } .container.reservation .contentsInner .topSection .subDesc02 li:nth-child(1) {margin-right: 54px; } .container.reservation .contentsInner .topSection .subDesc02 li:nth-child(2) {margin-right: 54px; } .container.reservation .contentsInner .topSection .subDesc02 li:nth-child(3) {margin-right: 66px; } .container.reservation .contentsInner .topSection .subDesc02 li:nth-child(4) { } .appMark {width:38px;vertical-align: bottom; } .container.reservation .contentsInner .bottomSection {margin-top: 80px; } .container.reservation .contentsInner .bottomSection .appStepArea h4 {text-align: center;font-size: 30px;font-weight: 700; } .container.reservation .contentsInner .bottomSection .appStepArea ul {display: flex;justify-content: space-around;margin-top: 80px;margin-bottom: 100px; } .container.reservation .contentsInner .bottomSection .appStepArea li {padding-top: 365px; } .container.reservation .contentsInner .bottomSection .appStepArea li:nth-child(1) {background: url("../images/customer_service/bg_app_01.png") no-repeat center top; } .container.reservation .contentsInner .bottomSection .appStepArea li:nth-child(2) {background: url("../images/customer_service/bg_app_02.png") no-repeat center top; } .container.reservation .contentsInner .bottomSection .appStepArea li:nth-child(3) {background: url("../images/customer_service/bg_app_03.png") no-repeat center top; } .container.reservation .contentsInner .bottomSection .appStepArea li:nth-child(4) {background: url("../images/customer_service/bg_app_04.png") no-repeat center top; } .appMarkWrap {width:70px;height:70px;background-color:#ff866d;border-radius:50%;position:relative;margin:0 auto 8px; } .appMarkWrap img {height:40px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%); } .container.reservation .contentsInner .bottomSection .appStepArea li strong {display: block;font-size: 20px;color: #ff7153;font-weight: 700; } .container.reservation .contentsInner .bottomSection .appStepArea li p {padding-top: 10px;font-size: 17px;line-height: 28px; } .container.reservation .contentsInner .bottomSection .appDownArea {padding:54px 0 34px 95px;background:#ff7153;position:relative;/*background: url("../images/customer_service/bg_download.png") no-repeat left top; */} .container.reservation .contentsInner .bottomSection .appDownArea img { position:absolute; right:94px; bottom:0; } .container.reservation .contentsInner .bottomSection .appDownArea p {font-weight: 200;font-size: 25px;line-height: 35px;color: #f9f9f9; } .container.reservation .contentsInner .bottomSection .appDownArea p span {font-weight: 400;font-size: 25px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea {padding: 40px 0; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a {display: inline-flex;align-items: center;-webkit-box-align: center; -ms-flex-align: center;justify-content: center;-webkit-box-pack: center;-ms-flex-pack: center;width: 189px;margin-right:12px;padding: 9px 0;color: #fff;border: 1px solid #fff;transition: all 0.3s; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a i {padding-right: 3px;font-size: 30px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a span {font-size: 17px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a:hover {background-color: #fff; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a:hover i, .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a:hover span {color: #ff7153; } .reservation .grayBox {margin-top: 60px;padding: 35px 90px; } .reservation .grayBox .subDesc ul li {font-weight: 200;font-size: 17px; line-height: 32px; } .reservation .grayBox .subDesc ul li:before {/*color: #f17c46; */} .seasonPass .grayBox { display: block; margin-top: 50px; padding-top: 50px; padding-left: 681px; } .seasonPass .grayBox.seoulland {background: url("../images/season_pass/seoulland_pass.png") no-repeat left top; } .seasonPass .grayBox.dulmoa {background: url("../images/season_pass/dulmoa_pass.png") no-repeat left top; } .seasonPass .grayBox.damoa {background: url("../images/season_pass/damoa_pass.png") no-repeat left top; } .seasonPass .grayBox.damoa {padding-top: 50px; } .seasonPass .grayBox strong { font-weight: 800; font-size: 35px; display: block; margin-bottom: 70px; } .seasonPass .grayBox h3 {font-size: 26px;font-weight: 700;line-height: 43px; } .seasonPass .grayBox h3 span {color: #00939b; } .seasonPass .grayBox p {margin-top: 30px;font-size: 18px;line-height: 30px; } .seasonPass .tblArea .tblType th, .seasonPass .tblArea .tblType td {padding: 30px 10px;line-height: 30px;text-align: center;vertical-align: middle; } .contact1 .tblArea .tblType td { font-size: 18px; font-weight: 400; line-height: 33px; } .contact1 .tblArea .tblType th {font-weight: 700; line-height: 1.4; } .contact1 .tblArea .tblType tr:first-child th {text-align:center; } .seasonPass .stepArea {display: block;margin-bottom: 0; } .seasonPass .stepArea ol {display: flex;justify-content: space-between; } .seasonPass .stepArea span, .seasonPass .stepArea strong {display: block; } .seasonPass .stepArea span {padding-bottom: 35px;font-size: 20px;font-weight: 700; } .seasonPass .stepArea strong {font-size: 25px;font-weight: 800;display:block;margin-top:25px; } .seasonPass .stepArea p {margin-top: 20px;font-size: 16px;font-weight: normal;line-height: 26px; } .seasonPass .stepArea li {position: relative; } .seasonPass .stepArea li i {font-size: 40px;color:#000; } .seasonPass .stepArea li i.xi-arrow-right {position: absolute;right: -68px;top: 94px;font-size: 35px;color: #d7d7d7; } .seasonPass .stepArea li:nth-child(1) {/*background: url("../images/season_pass/step01.png") no-repeat left 65px; */} .seasonPass .stepArea li:nth-child(2) {/*background: url("../images/season_pass/step02.png") no-repeat left 65px; */} .seasonPass .stepArea li:nth-child(3) {/*background: url("../images/season_pass/step03.png") no-repeat left 65px; */} .seasonPass .stepArea li:nth-child(4) {/*background: url("../images/season_pass/step04.png") no-repeat left 65px; */} .seasonPass .promotionList ul:after {display: block;content: '';clear: both; } .seasonPass .promotionList ul {display:flex; flex-wrap:wrap;margin:0 -15px; } .seasonPass .promotionList ul li {/*flex:0 1 25%; */ padding:0 15px 45px;box-sizing: border-box; } .seasonPass .promotionList ul li a {display: block;height:100%;text-align: center;border: 2px solid #ebebeb;transition: all 0.3s ease; } .seasonPass .promotionList ul li a:hover {border-color: #00939b;-moz-box-shadow: 0 0 20px #dedede;outline: 1px solid #00939b;-webkit-box-shadow: 0 0 20px #dedede;box-shadow: 0 0 20px #dedede;transition: all 0.2s; } .seasonPass .promotionList ul li a dl {padding: 21px 20px 31px; } .seasonPass .promotionList ul li a dl dt strong {display: block;font-size: 20px;line-height: 26px;height:52px;font-weight: 400;display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;white-space: normal;word-break:keep-all; } .seasonPass .promotionList ul li a:hover dt strong {font-weight: 700;color: #00939b; } .seasonPass .promotionList ul li a dl dd {padding-top:5px;font-size:14px;line-height: 26px;color: #787878;white-space: normal;overflow: visible;text-overflow: clip; } .seasonPass .contentDescription {margin-top: 150px; } .seasonPass .contentDescription > li:last-child {margin-bottom: 0; } .seasonPass .attr-info .desc {word-break: keep-all; } .tblArea .descNotice li {font-weight: 200; } .tblArea .descNotice strong {font-weight: 400; } .seasonPass .modal .showSlider .swiper-slide {width: 800px;height: 480px;background-color: #aaa; } .seasonPass .modal .bottom-btns {margin: 50px 0 20px; } .nodata {text-align:center; margin-top:200px; } .nodata img {width:18%; } .nodata div {padding-top:50px; color:#ababab;font-size:20px; } @media all and (max-width:1200px) { .nodata img {width:20%; } } @media all and (max-width:1000px) { .nodata img {width:20%; } .nodata div {padding-top:20px; color:#ababab;font-size:14px;opacity: 0.8} } @media all and (max-width:600px) { .nodata img {width:30%; } } /*************************************************************************************************** 컨텐츠 위주 및 OVERRIDE ***************************************************************************************************/ /* 이승민 퍼블리셔 작업본 소스 겹치지 않게 하기 위함. Fonts GmarketSans */ /* 임시 OVERRIDE */ /* .header .headerInner { min-width: inherit !important; width:auto!important; } .subVisual .subVisualInner { max-width:1400px!important; width:auto!important; } .footerInner { max-width:1400px!important; width:auto!important; } .container, .container .containerInner { width:auto !important; max-width:1400px; } .gnbArea { display:none; } */ .container .containerInner { padding:100px 20px 150px; } .reservation .containerInner { padding-left:0; padding-right:0; } .tblArea .tblType th { padding:25px 40px; line-height: 1.4; } .tblArea .tblType td { padding:25px 30px; line-height: 1.4; vertical-align: middle} .container, .container .containerInner { width:auto; max-width:1400px; } .container { margin-bottom: 0; } .listType.bulType li p { font-weight: 200; } .tabArea { padding-top:0; } .tblArea .tblType td p.subDesc { line-height: 1.5; margin-top:5px; } .tblArea .tblType td p.subDesc:first-child { margin-top:10px; } .tblArea .tblType th.text-center { padding-left:20px; padding-right:20px; } .tblArea .tblType td.text-center { padding-left:20px; padding-right:20px; } .tblArea .tblType .middle { vertical-align: middle !important; } /*************************************************************************************************** Plugin ***************************************************************************************************/ .hidden { overflow:hidden; } .modal-backdrop { position: fixed; top:0; right:0; bottom:0; left:0; background:#000; z-index:7500; opacity:.7; filter:alpha(opacity=70); } .modal { display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:8000; overflow:auto; -webkit-overflow-scrolling:touch; outline:0; } .modal-dialog { position:relative; width:auto; margin:0 auto; padding:0 30px; margin-bottom: 20px; } .modal-content { position:relative;; padding-top:70px; } .modal-content .showSlider { background-color:#fff; } .modal-content .btn-close { position: absolute; right:0; top:0; width:50px; height: 50px; border-radius:100%; background: #fff; text-align: center; line-height: 50px; font-size:24px; color: #00939b; border:0; transition: all 0.3s ease; display: flex; justify-content: center; align-items: center;} .modal-content .btn-close:hover { background-color:#00939b; color: #fff; transform: rotate(90deg);} .modal-content .btn-close svg {fill: #00939b; transition: all .3s} .modal-content .btn-close:hover svg{fill: #fff} .modal-header { position: relative; display: flex; justify-content: space-between; align-items: center; height: 100px; padding:0 50px; box-sizing: border-box; background: #00939b; } .modal-header .h5 { font-size:35px; color: #fff; font-weight: 700; line-height: 100px; } .modal-header.modal-header-sm { height:80px; } .modal-header.modal-header-sm .h5 { font-size:25px; } .modalCard .email.email-sm { font-size: 18px; } .modal-body { overflow: hidden; border-radius:25px; overflow: hidden; } body.overflow { overflow: hidden; } .modalImgWrap {width: calc(100vw - 30px);max-width:800px;height:calc(62.875vw - 18.8625px);max-height:503px;overflow:hidden; } /*************************************************************************************************** Common ***************************************************************************************************/ /* Padding, Margin */ .mb10 { margin-bottom: 10px !important; } .mb20 { margin-bottom: 20px !important; } .mb30 { margin-bottom: 30px !important; } .mb35 { margin-bottom: 35px !important; } .mb40 { margin-bottom: 40px !important; } .mb50 { margin-bottom: 50px !important; } .mb60 { margin-bottom: 60px !important; } .mb70 { margin-bottom: 70px !important; } .mb80 { margin-bottom: 80px !important; } .mb90 { margin-bottom: 90px !important; } .mb100 { margin-bottom: 100px !important; } /* Reset */ button,input[type=button] { cursor: pointer; outline:none; } input[type=text] { outline:none; } /* Form */ input.checkbox { position: absolute; left: -9999px; } input.checkbox + em { display: inline-block; vertical-align: middle; width:23px; height: 23px; border: 1px solid #ddd; border-radius:100%; position: relative; } input.checkbox + em + span { display: inline-block; vertical-align: middle; font-size:18px; color: #222; margin:-3px 0 0 5px; } input.checkbox:checked + em { background: #00939b url("../images/common/checkChecked.png") no-repeat; border-color:#00939b; } /* Text */ .text-left { text-align: left !important; } .text-center { text-align: center !important; } .text-right { text-align: right !important; } .text-medium { font-weight: 500 !important; } .text-normal { font-weight: 400 !important; } .f14 { font-size:14px !important; } .f20 { font-size:20px !important; } .f25 { font-size:25px !important; } .titWant { text-align: center; font-size:25px; font-weight: 700; margin-bottom: 30px; } .titWant.titWantAll { font-weight: 400; } .pointColor2 { color: #00939b; } .gray { color: #7a7a7a; } .color1 { color: #00939b; } /* Button */ .btn-type1, .btn-type2 {min-width: 210px;display: inline-flex;padding: 0 35px;height: 56px;border-radius: 56px;align-items: center;justify-content: center;font-size: 18px;color: #000;border: 1px solid #000;transition: all 0.3s ease;box-sizing: border-box;text-align: center;} .btn-type1:hover, .btn-type2:hover { color:#fff; border-color:#00939b; background:#00939b; } .btn-type2 svg, .btn-type1 svg {margin-left: 20px; } .btn-type1:active, .btn-type2:active { color:#fff; border-color:#00939b; background:#00939b; } .btn-type1:hover svg, .btn-type2:hover svg {fill: #fff} .small { height: 33px; line-height: 31px; min-width:inherit; padding:0 20px; font-size:16px; } .btnLink1 { display: inline-block; vertical-align: middle; padding:3px 0; font-size:18px; color: #00939b; font-weight: 400; border-bottom: 2px solid transparent; transition: all 0.3s ease; } .btnLink1:after { content: ''; display: inline-block; vertical-align: middle; width:7px; height: 7px; border-left:2px solid #00939b; border-bottom: 2px solid #00939b; transform: rotate(-135deg); margin:-3px 0 0 20px; } .btnLink1:hover { border-bottom-color:#00939b; } /* Element */ .bottom-btns { text-align: center; } .bottom-btns > a, .bottom-btns > button { margin:0 8px; } .flex { display: flex; justify-content: space-between; align-items: center; } /* Board > Search Area */ .board-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 35px; } #searchFrm .board-head .right { margin-top: 0px; } .board-head .h3 { font-size:15px; color: #000; font-weight: 400; } .board-head .h3 strong { font-weight: 700; color: #00939b; } .board-head .srch-box { position: relative; padding-right:46px; background-color: #f3f3f3; border-radius: 50px; padding-left: 20px} .board-head .srch-box .inp-srch { width:220px; height: 40px; font-size:15px; color: #000; box-sizing: border-box; padding: 0; border: 0; font-family: 'Pretendard'; background-color: transparent} .board-head .srch-box .btn-srch { position: absolute; right:0; top:0; width:40px; height: 40px; border-radius:100%; background: #00939b; color: #fff; border: 0; outline:none; display: flex; align-items: center; justify-content: center} .board-head .srch-box .btn-srch svg {fill: #fff; font-size: 18px} .board-head .srch-box ::-webkit-input-placeholder { color: #ababab; } .board-head .srch-box :-ms-input-placeholder { color: #ababab; } .board-head .btnDownload { display: inline-block; font-size:15px; font-weight: 500; } .board-head .btnDownload svg {font-size:18px; margin-right:5px; vertical-align: middle;} .board-head.borderBottom { border-bottom: 2px solid #000; padding-bottom: 20px; margin-bottom: 30px; } .sortBtns a { display: inline-block; vertical-align: middle; font-size:25px; font-weight: 700; line-height: 1.2; padding-bottom: 4px; /*border-bottom:3px solid transparent; */ margin-right:40px; /*transition: 0.3s ease; */ } .sortDesc { font-size:13px; display:block; margin-bottom:5px; font-weight:400; } .sortBtns a.active { color: #f17c46; } .sortBtns a.active p { display:inline-block; color: #f17c46; border-bottom:3px solid #f17c46; } .sortBtns.scrollType { } .sortBtns.scrollType a { margin-bottom: 15px; } .vertical-m { vertical-align:middle; } /* 1-1 운영시간 */ .swiperCalender { border-top:1px solid #000; } .swiperCalender .slider { padding:20px 135px; text-align: center; position: relative; } .swiperCalender .slider .swiper-slide { } .swiperCalender .slider .swiper-slide a { display: block; position: relative; padding-top:17px; height: 60px; box-sizing: border-box; } .swiperCalender .slider .swiper-slide a .month { font-size:12px; color: #00939b; font-weight: 700; position:absolute; left: 0; right:0; top:0; } .swiperCalender .slider .swiper-slide a .date { font-size:22px; color: #000; } .swiperCalender .slider .swiper-slide a .date span { } .swiperCalender .slider .swiper-slide a:before { content: ''; position: absolute; left: 50%; bottom:0; width:8px; height: 8px; margin-left: -4px; border-radius:100%; background: #00939b; opacity: 0; } .swiperCalender .slider .swiper-slide a.on .date { color: #00939b; } .swiperCalender .slider .swiper-slide a.on .date span { font-weight: 700; } .swiperCalender .slider .swiper-slide a.on:before { opacity:1; } .swiperCalender .slider .swiper-slide a.checkSunday .date span { border-bottom: 1px solid #dc1c1b; color: #dc1c1b; } .swiperCalender .slider .swiper-slide a.checkSaturday .date span { border-bottom: 1px solid #0059bd; color:#0059bd; } .swiperCalender .slider .swiper-slide a.on.checkSunday .date span { color: #00939b; } .swiperCalender .slider .swiper-slide a.on.checkSaturday .date span { color: #00939b; } .swiperCalender .slider .swiper-button-next, .swiperCalender .slider .swiper-button-prev { font-size:40px; color: #000; outline:none; width:40px; height: 40px; margin-top:-20px; } .swiperCalender .slider .swiper-button-prev { left: 58px; } .swiperCalender .slider .swiper-button-next { right: 58px; } .swiperCalender .slider .swiper-button-next.swiper-button-disabled, .swiperCalender .slider .swiper-button-prev.swiper-button-disabled { opacity:0.3; } .todayTime { padding: 60px 0px; text-align: center; background: #f9f9f9; border-top:1px solid #000; margin-bottom:75px; } #TodayTime .todayTime { margin-bottom:0px; } .todayTime .labels { margin-bottom: 20px; } .todayTime .labels .labelNight { display: inline-block; vertical-align: middle; padding:0 10px 0 10px; height: 28px; border: 1px solid #00939b; font-size:14px; color: #00939b; box-sizing: border-box; line-height: 27px; border-radius:28px; } .todayTime .labels .labelNight svg { font-size:16px; margin-right:2px; position: relative; top:3px; fill: #00939b } .todayTime .labels .labelNormal { display: inline-block; vertical-align: middle; padding:0 10px 0 10px; height: 28px; border: 1px solid #00939b; font-size:14px; color: #00939b; box-sizing: border-box; line-height: 28px; border-radius:28px; } .todayTime .labels .labelNormal i { font-size:16px; margin-right:2px; position: relative; top:2px; } .todayTime .today { font-size:38px; font-weight: 700; color: #000; } .todayTime .times { font-size:0; margin-top:60px; } .todayTime .times div { display: inline-block; vertical-align: middle; } .todayTime .times div strong { display: inline-block; vertical-align: middle; width:70px; height: 90px; line-height: 90px; font-size:40px; color: #fff; font-weight: 700; background: #00939b; margin:0 5px; } .todayTime .times div + div { padding-left: 36px; position: relative; } .todayTime .times div + div:before { content: ''; position: absolute; left: 18px; top:32px; width:6px; height: 6px; border-radius:100%; background: #000000; margin-left: -3px; } .todayTime .times div + div:after { content: ''; position: absolute; left: 18px; top:52px; width:6px; height: 6px; border-radius:100%; background: #000000; margin-left: -3px; } .todayTime .times span { display: inline-block; vertical-align: middle; width:90px; font-size:50px; color: #000; font-weight: 700; line-height: 90px; } .mobile_day { display:none; } /* 1-2 공지사항 */ .notice-list ul { display: flex; flex-wrap: wrap; margin:0 -35px; } .notice-list ul li { flex-grow: 0;flex-shrink: 1;flex-basis: calc(33.3333% - 70px);padding:0 35px 40px;width:calc(33.3333% - 70px); position: relative; } .notice-list ul li a { display: block; height: 100%; border: 1px solid #d7d7d7; padding: 85px 40px 75px; box-sizing: border-box; position: relative; transition: all 0.3s ease; outline:1px solid transparent; } .notice-list ul li a dl { position: relative; } .notice-list ul li a dl:before { content: ''; position: absolute; left: 0; top:-30px; width:12px; height: 12px; border-radius:100%; background: #00939b; transition: all 0.3s ease; } .notice-list ul li a dl dt { position: relative; font-size:28px; line-height: 40px; height: 80px; overflow: hidden; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap: break-word; font-weight: 700; margin-bottom: 35px; } .notice-list ul li a dl dd { font-size:18px; line-height: 28px; height:112px; overflow: hidden; display: -webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; margin-bottom: 80px; } .notice-list ul li a p { font-size:13px; color: #ababab; } .notice-list ul li a .icon { position: absolute; right:40px; bottom:45px; width:80px; height: 80px; border-radius:100%; transition: all 0.3s ease; font-size:35px; color: #777777; display: flex; align-items: center; justify-content: center} .notice-list ul li a .icon svg {fill: #777; transition: all .3s} .notice-list:not(.type2) ul li a:hover .icon {background: #00939b;transform: rotate(90deg);} .notice-list:not(.type2) ul li a:hover .icon svg {fill: #fff} .notice-list:not(.type2) ul li a:hover { border-color:#00939b; outline:1px solid #00939b; box-shadow:0 0 25px rgba(0,0,0,0.1); } .notice-list:not(.type2) ul li a:hover i { color: #fff; background: #00939b; transform: rotate(90deg); } .notice-list:not(.type2) ul li a:hover dl:before { top:-35px; } .notice-list.type2 ul li a { padding-right:70px; position:relative; } .notice-list.type2 ul li a .stat { position:absolute; right:0; top:50%; width:50px; line-height:24px; height:26px; padding:0 5px; border-radius:26px; border:1px solid #f17c46; color:#f17c46; font-size:12px; text-align:center; margin-top:-13px; } .notice-list.type2 ul li a p span { font-size:11px; color:#d7d7d7; margin:0 3px; } .notice-view { } .notice-view .head { border-bottom: 1px solid #f0f0f0; padding:40px 0 65px; position: relative; } .notice-view .head:before { content: ''; position: absolute; left: 0; top:0; width:15px; height: 15px; border-radius:100%; background: #00939b; } .notice-view .head .h4 { font-size:50px; line-height: 1.2; font-weight: 500; margin-bottom: 35px; } .notice-view .head .date { font-size:16px; color: #ababab; } .notice-view .head .snsBox { position:relative; } .notice-view .head .snsBox .btnShare { font-size:30px; border: 0; background: none; } .notice-view .body { margin-bottom: 105px; } .notice-view .body .text-area { padding: 85px 50px; font-size:20px; line-height: 2; overflow:hidden; } .notice-view .body .files { padding:30px 45px; border-top:1px solid #d7d7d7; } .notice-view .body .files dl { position: relative; padding-left: 95px; font-size:18px; color: #ababab; line-height: 1.6; } .notice-view .body .files dl dt { position: absolute; left: 0; top:0; } .notice-view .body .files dl dd, .notice-view .body .files dl dd a { color: #ababab; } .notice-view .tooltip { display: none; position: absolute; z-index: 1; left: -250px; top: -10px; padding: 5px 22px; border: 5px solid #fff; border-radius: 30px; background-color: #F7FFF7; text-align: center; box-shadow: 5px 5px 10px rgb(0 0 0 / 30%);width:180px;height:30px; } .notice-view .tooltip a:first-child { margin-left: 0; } .notice-view .tooltip a { margin-left: 17px; } .notice-view .tooltip a img { width: 26px; } .notice-view .tooltip i { font-size: 30px; } .notice-view .tooltip i.xi-facebook { color: #4567ab; } .notice-view .tooltip i.xi-kakaotalk { color: #452828; } .notice-view .tooltip i.xi-twitter { color: #53cafb; } .notice-view .tooltip::before { content: ''; position: absolute; display: block; width: 0px; right: -30px; top: 50%; border: 7px solid transparent; border-right: 0; border-left: 17px solid #fff; transform: translate(calc(-100% - -8px), -50%); } /* 1-3 오시는길 */ .contactMap { height: 560px; margin-bottom: 30px; position: relative} .contactMap iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-position: center; object-fit: cover} .contact1 .addr { margin-bottom: 50px; } .contact1 .addr span { font-size:30px; font-weight: 700; display: inline-block; vertical-align: middle; margin-right:20px; } .contact1 .train { font-size:18px; display: flex; align-items: center} .contact1 .train svg {margin-right: 10px;} .contact1 .train span { color: #00939b; font-weight: 500; } .contact1 .train i { font-size:20px; margin-right:10px; transform: translateY(2px); } .elephantDesc { padding: 80px 110px 110px; position: relative; background: #f9f9f9 url(../images/time/img_train.png) no-repeat 90% 80%; margin-bottom: 90px; } .elephantDesc dl dt strong { display: block; font-size:40px; color: #00939b; font-weight: 700; } .elephantDesc dl dt p { font-size:30px; line-height: 1.5; padding:22px 0 25px; font-weight: 700; } .elephantDesc dl dd { font-size:18px; line-height: 1.7; } .contentDescription { counter-reset: num; } .contentDescription > li { display: flex; justify-content: space-between; margin-bottom: 140px; } .contentDescription > li .head { } .contentDescription > li .head:before { counter-increment: num; content:"0" counter(num); display: block; font-size:15px; color: #00939b; margin-bottom: 3px; font-weight: 700; } .contentDescription > li .head .h4 { font-size:30px; font-weight: 700; line-height: 1.4; } .contentDescription > li .head .h4 small { display: block; padding-top:25px; font-size:23px; line-height: 1.6; font-weight: 400; } .contentDescription > li .head .h4 div { font-size:30px; font-weight: 400; } .contentDescription > li .body { width:73%; } .contentDescription > li .body img { max-width:100%; } .contentDescription > li .body .seoulMap1 { margin-bottom: 25px; } .contentDescription > li .body .mapDesc { font-size:18px; } .chargedDesc { font-size:15px; font-weight:normal; } .description1 { padding: 47px 43px; background: #f9f9f9; } .description1 dl:after { display: block; content: ''; clear: both; } .description1 dl { font-size:16px; line-height: 1.5; } .description1 dl + dl { margin-top:20px; } .description1 dl dt { float:left; padding-right:12px; color: #00939b; font-weight: 500; } .description1 dl dd { overflow: hidden; } .description2 { padding: 20px 50px 25px; background: #f9f9f9; font-size:0; text-align: center; margin-top:30px; } .description2 dl { display: inline-block; vertical-align: top; padding:5px 19px; font-size:18px; line-height: 1.2; } .description2 dl dt { display: inline-block; vertical-align: middle; color: #00939b; font-weight: 500; padding-right:10px; } .description2 dl dd { display: inline-block; vertical-align: middle; } .description3 div { font-size:17px; line-height: 32px; padding-left: 20px; position: relative; } .description3 div:before { content: '※'; position: absolute; left: 0; color: #000; } .description3 { /*margin-top:-15px; */ } /* 1-4 가이드 */ .guideTabs { display: flex; justify-content: space-between; white-space: nowrap; margin-bottom: 90px; } .mainSubEng .guideTabs { white-space: normal; } .guideTabs a { display: block; width:90px; text-align: center; } .guideTabs a p { font-size:15px; color: #ababab; padding:13px 0 20px; position: relative; line-height: 1.3 } .guideTabs a p:after { content: ''; position: absolute; left: 50%; bottom:-5px; width:10px; height: 10px; border-radius:100%; background: #00939b; margin-left: -5px; transition: all 0.3s ease; opacity:0; } .guideTabs a:before { content: ''; display: block; width:70px; height: 70px; border-radius:100%; background: #f6f6f6; background-repeat: no-repeat; background-position: 50% 50%; transition: all 0.3s ease; margin:0 auto; background-size: 40px 40px; } .guideTabs a.t1:before { background-image: url(../images/time/ico_guide1.svg); } .guideTabs a.t2:before { background-image: url(../images/time/ico_guide2.svg); } .guideTabs a.t3:before { background-image: url(../images/time/ico_guide3.svg); } .guideTabs a.t4:before { background-image: url(../images/time/ico_guide4.svg); } .guideTabs a.t5:before { background-image: url(../images/time/ico_guide5.svg); } .guideTabs a.t6:before { background-image: url(../images/time/ico_guide6.svg); } .guideTabs a.t7:before { background-image: url(../images/time/ico_guide7.svg); } .guideTabs a.t8:before { background-image: url(../images/time/ico_guide8.svg); } .guideTabs a.t9:before { background-image: url(../images/time/ico_guide9.svg); } .guideTabs a.t10:before { background-image: url(../images/time/ico_guide10.svg); } .guideTabs a.t11:before { background-image: url(../images/time/ico_guide11.svg); } .guideTabs a.t12:before { background-image: url(../images/time/ico_guide12.svg); background-size: 32px 32px; } .guideTabs a.t13:before { background-image: url(../images/time/ico_guide13.svg); } .guideTabs a.t14:before { background-image: url(../images/time/ico_guide14.svg); } .guideTabs a:hover p, .guideTabs a.active p { color: #00939b; font-weight: 500; } .guideTabs a:hover p:after, .guideTabs a.active p:after { bottom:0; opacity:1; } .guideTabs a:hover:before, .guideTabs a.active:before { background-color:#00939b; } .guideTabs a.t1:hover:before, .guideTabs a.t1.active:before { background-image: url(../images/time/ico_guide1_on.svg); } .guideTabs a.t2:hover:before, .guideTabs a.t2.active:before { background-image: url(../images/time/ico_guide2_on.svg); } .guideTabs a.t3:hover:before, .guideTabs a.t3.active:before { background-image: url(../images/time/ico_guide3_on.svg); } .guideTabs a.t4:hover:before, .guideTabs a.t4.active:before { background-image: url(../images/time/ico_guide4_on.svg); } .guideTabs a.t5:hover:before, .guideTabs a.t5.active:before { background-image: url(../images/time/ico_guide5_on.svg); } .guideTabs a.t6:hover:before, .guideTabs a.t6.active:before { background-image: url(../images/time/ico_guide6_on.svg); } .guideTabs a.t7:hover:before, .guideTabs a.t7.active:before { background-image: url(../images/time/ico_guide7_on.svg); } .guideTabs a.t8:hover:before, .guideTabs a.t8.active:before { background-image: url(../images/time/ico_guide8_on.svg); } .guideTabs a.t9:hover:before, .guideTabs a.t9.active:before { background-image: url(../images/time/ico_guide9_on.svg); } .guideTabs a.t10:hover:before, .guideTabs a.t10.active:before { background-image: url(../images/time/ico_guide10_on.svg); } .guideTabs a.t11:hover:before, .guideTabs a.t11.active:before { background-image: url(../images/time/ico_guide11_on.svg); } .guideTabs a.t12:hover:before, .guideTabs a.t12.active:before { background-image: url(../images/time/ico_guide12_on.svg); } .guideTabs a.t13:hover:before, .guideTabs a.t13.active:before { background-image: url(../images/time/ico_guide13_on.svg); } .guideTabs a.t14:hover:before, .guideTabs a.t14.active:before { background-image: url(../images/time/ico_guide14_on.svg); } .guideMapBtns { margin-bottom: 75px; } .guideMapBtns ul li { display: inline-block; vertical-align: top; padding:0 15px 20px 0; } .guideMapBtns ul li a { display: block; padding:0 20px; height: 38px; line-height: 36px; font-size:17px; border-radius:44px; border:2px solid #f6f6f6; background: #f6f6f6; transition: background-color .3s , border-color .3s; } .guideMapBtns ul li a.active, .guideMapBtns ul li a:hover { color: #00939b; border-color:#00939b; background: #fff; font-weight: 500} .guideMapBtns ul li a span {position: relative} .guideMapBtns ul li a span::before {content: attr(data-title);display: block;font-weight: 500;height: 0px; visibility: hidden;} /*가이드맵 수정*/ .guideMap { position:relative; overflow:hidden; height:730px; } .guideMapSize { position:absolute; top:0; right:0; z-index:1; } .guideMapSize button { width:60px; height:60px; outline:none; border:1px solid #d7d7d7; box-sizing:border-box; background-color:#fff; } .guideMapSize button:nth-child(1) { margin-right:-5px; } .guideMapSize button:nth-child(2) { } .guideMapSize button svg { font-size:23px; fill:#777777; } .guideMapName { transform: translate(9px, 18px); white-space: nowrap; position:absolute; display:inline-block; box-sizing:border-box; background-color:#00939b; height:45px; border-radius:30px; font-size:15px; line-height:45px; color:#fff; text-align:center; padding:0 25px 0 20px; box-shadow:0 5px 10px rgba(0,0,0, .4); } .guideMapName::after { position:absolute; content:''; display:block; left:50%; transform:translateX(-15px); bottom:-29px; width:17px; height:30px; border-top:15px solid #00939b; border-left:10px solid transparent; border-right:10px solid transparent; border-bottom:15px solid transparent; box-sizing:border-box; } .guideMapName svg {fill: #fff; margin-right: 3px; transform: translateY(1px)} .guideMapMark { position:absolute; z-index:1; left:26px; bottom:26px; padding: 0 40px ;height:60px; border:1px solid #d7d7d7; background-color:#fff; text-align:center; } .guideMapMark ul { display: flex; } .guideMapMark ul::after { display:block; content:''; clear:both; } .guideMapMark li { position:relative; margin-right:25px; padding-left:20px; line-height:60px; } .guideMapMark li:last-child { margin-right:0; } .guideMapMark li::after { position:absolute; left:0; top:50%; transform:translateY(-50%); width:14px; height:14px; border-radius:50%; content:''; } .guideMapMark li:nth-child(1)::after { background-color:#ff7dc1; } .guideMapMark li:nth-child(2)::after { background-color:#ad7aef; } .guideMapMark li:nth-child(3)::after { background-color:#f98c65; } .guideMapMark li:nth-child(4)::after { background-color:#7a8cf6; } @media(max-width:600px) { .guideMap {height:120vw; } } @media(max-width:555px) { .guideMapMark {left: 15px;width:calc(100% - 33px);height: 55px; } .guideMapName {fonnt-size:5.4vw; } .guideMapMark li {margin-right:10px;padding-left:11px;font-size:3.24vw;line-height: 55px; } .mainSubEng .guideMapMark li {line-height:27.5px; } } @media(max-width:450px) { .guideMap {height:120vw; } .mainSubEng .guideMapMark ul {padding-left: 5px; } .mainSubEng .guideMapMark li { padding-left: 13px;font-size: 12px; } } /*가이드맵 수정*/ .guideMap img { max-width:100%; } .shopList { } .shopList ul li { border-bottom:1px solid #ddd; } .shopList ul li:last-child { border-bottom-color:#000; } .shopList ul li a { display: block; padding:50px 0; display: flex; align-items: center; } .shopList ul li a .photo { flex: 0 0 410px; position: relative; } .shopList ul li a .photo img { width:100%; } .shopList ul li a .photo i { position: absolute; left:50%; top:50%; background:rgba(0,0,0,0.6); text-align: center; line-height: 55px; width:55px; height: 55px; font-size:30px; color: #fff; border-radius:100%; margin:-28px 0 0 -28px; transition: all 0.3s ease; } .shopList ul li a .info { flex: 1 1 auto; padding-left: 65px; } .shopList ul li a .info .tit { font-size:30px; font-weight: 700; margin-bottom: 15px; } .shopList ul li a .info .txt { font-size:20px; line-height: 1.7; font-weight: 400; margin-bottom: 26px; } .shopList ul li a .info .loc { padding-left: 96px; position: relative; } .shopList ul li a .info .loc span { position: absolute; left: 0; top:0; padding:0 28px; line-height: 27px; border-radius:27px; background: #f6f6f6; font-size:15px; color: #00939b; font-weight: 400; } .shopList ul li a .info .loc p { font-size:20px; font-weight: 400; line-height: 27px; } .shopList ul li a:hover .photo i { transform: rotate(90deg); } .modal .mapSlider { position: relative; } .modal .mapSlider img { width:100%; } .modal .swiper-pagination { bottom:30px; } .modal .swiper-pagination-bullet { width:6px; height: 6px; opacity:1; background: rgba(255,255,255,0.6); transition: all 0.5s ease; border-radius:12px; } .modal .swiper-pagination-bullet.swiper-pagination-bullet-active { width:20px; background: #00939b; } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 3px} /* 2-1 이용요금 */ .pays { overflow: hidden; } .pays div { float:left; margin:0 15px 15px 0; } .pays div img { vertical-align: top; } .priceBox1 { display: flex; justify-content: space-between; margin:0 -28px 20px; } .priceBox1 dl { flex:1; padding:34px 0 50px; margin:0 28px; border-top:2px solid #000; border-bottom: 1px solid #ababab; } .priceBox1 dl dt { font-size:22px; line-height: 1.48; font-weight: 700; margin-bottom: 35px; } .priceBox1 dl dd div { font-size:20px; line-height: 1.45; padding-left: 18px; position: relative; } .priceBox1 dl dd div + div { margin-top:5px; } .priceBox1 dl dd div:before { content: ''; position: absolute; left: 3px; top:12px; width:6px; height: 6px; border-radius:100%; background: #000; } .priceBox1 dl dd div span { float:left; margin-right:4px; } .priceBox1 dl dd div p { overflow: hidden; } .mainSubEng .mobile.price-other1 .tblArea:last-child { border-bottom:1px solid #000; } /* 2-2 프로모션 */ .promotionList ul:after { display: block; content: ''; clear: both; } .promotionList ul { margin:0 -15px; } .promotionList ul li { float:left; width:25%; padding:0 15px 45px; box-sizing: border-box; } .promotionList ul li a { display: block; border: 2px solid #ebebeb; transition: all 0.3s ease; } .promotionList ul li a:hover { border-color:#00939b; box-shadow:0 0 25px rgba(0,0,0,0.1); } .promotionList ul li a div { margin: 40px auto 0; width: 95%; } .promotionList ul li a img { width:100%; } .promotionList ul li a dl { padding: 34px 30px 40px; } .promotionList ul li a dl dt small { display: block; font-size:15px; color: #00939b; font-weight: 700; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .promotionList ul li a dl dt strong { display: block; font-size:25px; line-height:33px; font-weight: 700; display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; height:66px; word-break:keep-all; } .promotionList ul li a dl dd { font-size:16px; padding-top:24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .promotionView { padding: 90px 0; } .promotionView .img img { max-width:100%; } .promotionView .img { margin-bottom: 40px; } .promotionView .date { text-align: center; padding: 25px 15px; background: #f9f9f9; font-size:25px; line-height: 1; margin-bottom: 70px; } .caution { } .caution .h4 { font-size:20px; margin-bottom: 15px; } .caution .h4 i { font-size:30px; vertical-align: middle; margin-right:7px; } .caution .h4 span { vertical-align: middle; } .caution ol { padding: 50px 30px; background: #f9f9f9; } .caution ol li { padding-left: 36px; position: relative; font-size:16px; line-height: 1.5; } .caution ol li + li { margin-top:15px; } .caution ol li span { position: absolute; left: 0; top:0; } .caution2 { } .caution2 .h4 { font-size:25px; margin-bottom: 20px; } .caution2 .h4 i { font-size:30px; vertical-align: middle; margin-right:7px; } .caution2 .h4 span { vertical-align: middle; } .caution2 .description3 { padding:30px; background: #f9f9f9; line-height: 1.6; } .caution2 .description3 div + div { margin-top:10px; } .contentDescription > li { display: flex; justify-content: space-between; margin-bottom: 140px; } .contentDescription > li .head { } .contentDescription > li .head:before { counter-increment: num; content:"0" counter(num); display: block; font-size:15px; color: #00939b; margin-bottom: 3px; font-weight: 700; } .cardList ul:after { display: block; content: ''; clear: both; } .cardList ul { display:flex; flex-wrap: wrap; margin:0 -10px; } .cardList ul li { flex:0 1 20%; box-sizing: border-box; padding:0 10px; margin-bottom: 55px; } .cardList ul li { flex:0 1 20%; box-sizing: border-box; padding:0 10px; margin-bottom: 55px; } .cardList.cardList-r ul li { padding:0 22px; } .cardList ul li a { display: block; position: relative; } .cardList ul li a .img { overflow: hidden; margin-bottom:6px; padding-top: 61%; position: relative} .cardList ul li a .img img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-position: center; object-fit: cover} .cardList.cardList-r ul li a .img { border-radius: 10px; } .cardList ul li a img { width:100%; transition: all 0.5s ease; } .cardList ul li a .dc { padding-bottom:3px; position:relative; } .cardList ul li a .dc strong { margin-top: -2px; float:left; padding:0 12px; height: 26px; line-height: 23px; border-radius:26px; border: 1px solid #00939b; font-size:15px; color: #00939b; font-weight: 500; box-sizing: border-box; margin-right:10px; transition: all 0.3s ease; transform:translateY(2px); } .mainSubEng .cardList.attraction-type.facility ul li a .dc strong { float:none; display:inline-block; margin-bottom: 5px; } .cardList ul li a .dc span { display:block; overflow:hidden; line-height:1.4; font-size:18px; vertical-align: middle; transition: all 0.3s ease } .cardList ul li a:hover .dc strong { background: #00939b; color: #fff; } .cardList ul li a:hover .dc span { color: #00939b; font-weight: 500; } .bcBanner { display:block; width:100%; margin-bottom:70px; position:relative; overflow:hidden; } .bcBannerTxt { display:block; width:100%; position:absolute; z-index:1; top:50%; transform:translateY(calc(-50% + 10px)); left:80px; } .bcBannerTxt p { color:#fff; font-size:20px; font-weight: 200; margin-bottom:15px; } .bcBannerTxt strong { font-size:40px; font-weight: 500; color:#ffd02c; } .bcBanner img { width:100%; } .bcBanner img.cardImgSmall { display:none; } @media(max-width:1200px) { .bcBanner img.cardImgBig { display:none; } .bcBanner img.cardImgSmall { display:block; } } /* 어트랙션 */ .cardList.attraction-type.attraction-desc { margin-bottom:20px; } .cardList.attraction-type.attraction-desc ul { margin: 0; } .cardList.attraction-type.attraction-desc ul li a .img { margin-bottom:15px; } .cardList.attraction-type.attraction-desc ul li { flex-grow: 0;flex-shrink: 1;flex-basis: calc(33.3333% - 54px); padding:0;margin-bottom:58px; } .cardList.attraction-type.attraction-desc ul li:nth-child(3n-2) {margin-right:80px;margin-left:0px; } .cardList.attraction-type.attraction-desc ul li:nth-child(3n-1) {margin-right:0;margin-left:0; } .cardList.attraction-type.attraction-desc ul li:nth-child(3n) {margin-right:0px;margin-left:80px; } .cardList.attraction-type.attraction-maintain ul { margin: 0; } .cardList.attraction-type.attraction-maintain ul li a .img { margin-bottom:15px; } .cardList.attraction-type.attraction-maintain ul li {flex-grow: 0;flex-shrink: 1;flex-basis: calc(33.3333% - 54px);padding:0;margin-bottom:58px; } .cardList.attraction-type.attraction-maintain ul li:nth-child(3n-2) {margin-right:80px;margin-left:0px; } .cardList.attraction-type.attraction-maintain ul li:nth-child(3n-1) {margin-right:0;margin-left:0; } .cardList.attraction-type.attraction-maintain ul li:nth-child(3n) {margin-right:0px;margin-left:80px; } .modalCard .head { padding: 40px 50px; background: #00939b; padding-right:135px; position: relative; } .modalCard .head:after { display: block; content: ''; clear: both; } .modalCard .head .img { float:left; width:230px; margin-right:22px; } .modalCard .head .img img { width:100%; } .modalCard .head .info { overflow: hidden; } .modalCard .head .info .kind { display: inline-block; vertical-align: middle; padding:0 11px; height: 26px; line-height: 24px; border-radius:26px; border: 1px solid #fff; font-size:16px; color: #fff; font-weight: 400; margin:15px 0 5px; } .modalCard .head .info .name { font-size:35px; color: #fff; font-weight: 700; line-height: 1.2; } .modalCard .head .btnLink { position: absolute; right:45px; top:45px; padding: 15px 20px; border-radius:10px; background: #00747a; font-size:15px; line-height: 1.2; color: #fff; font-weight: 500; } .modalCard .body { padding: 30px 50px 50px; background: #fff; } .modalCard .body dl { line-height: 1.7; } .modalCard .body dl dt { font-size:17px; font-weight: 500; } .modalCard .body dl dd { font-size:18px; font-weight: 400; margin-bottom: 25px; } .modalCard .body dl dd .txt { padding-left: 10px; text-indent: -10px; } .modalCard .body dl dd .description3 + .txt { padding-top:20px; } .modalCard .body .txt1 { font-size:18px; font-weight: 400; } .modalCard .email { font-size:20px; line-height:1.6; } .modalCard .email span { color:#00939b; } .modalCard .email small { display:block; font-size:16px; color:#898989; padding-top:30px; } .modalTabBtn { background:none; outline:none; border:none; margin: 4px 0; } .modalTabBtn:first-of-type { margin-right:20px; } .modalTabBtn span { font-weight: 200; font-size: 25px; color: #fff; line-height: 100px; } .modalTabBtn.select span { font-weight: 700; } .attractionKids { position:absolute; top:-10px; width:42px; height:42px; background-color:#f17c46; right:15px; border-radius:50%; line-height:42px; text-align:center; color:#fff; font-size:12px; } /**/ .cardList.attraction-type.course { margin-top:80px; } .cardList.attraction-type.course li .course-cover { background-color:rgba(0, 147, 155, 0); display:block; position:absolute; top:-10px; bottom:0; left:0; right:0; z-index:1; } .cardList.attraction-type.course li .course-cover i { opacity:0; font-size:45px; color:#fff; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); margin-left:-100px; } .cardList.attraction-type.course li:hover .course-cover { background-color:rgba(0, 147, 155, .7); transition:background-color .5s; } .cardList.attraction-type.course li:hover .course-cover i { opacity:1; transition:.5s; margin-left:0px; } .cardList.attraction-type.course ul { margin: 0 auto; } .cardList.attraction-type.course li { position: relative; z-index: 1; flex: 0 1 25%; padding: 0 8px 60px; box-sizing: border-box; margin-bottom: 0; } .cardList.attraction-type.course .ieLi li { flex: 0 1 23%; } .cardList.attraction-type.course li a { margin: 0 auto; text-align: center; padding-bottom: 0; } .cardList.attraction-type.course li a .img { width:220px; height: 220px; border-radius: 100%; position: relative; margin: 0 auto; z-index: 2; } .cardList.attraction-type.course li a .img img { position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: auto; height: 100%; } .cardList.attraction-type.course ul li a .dc { white-space: nowrap; overflow: visible; } .cardList.attraction-type.course li a .dc { position: relative; padding-left: 0; } .cardList.attraction-type.course li a .dc { padding-bottom: 3px; padding-top: 20px; } .cardList.attraction-type.course li a .dc strong { position: static; float: none; white-space:nowrap; } .cardList.attraction-type.course li a .dc strong { font-size: 15px; padding: 0 16px; line-height: 22px; height: 26px; display: inline-block; border-radius: 20px; margin: 0; font-weight: 400; } .cardList.attraction-type.course ul li a span { display: block; margin-top: 10px; } .cardList.attraction-type.course li a .dc span { font-size: 14px; } .cardList.attraction-type.course li a span span { display: inline; font-size: 18px; color: #00939b; margin-right: 5px; } .cardList.attraction-type.course li a span { display: block; margin-top: 5px; } .cardList.attraction-type.course li a .dc span { font-size: 20px; } .cardList.attraction-type.course span.mobile { display: inline !important; } .cardList.attraction-type.course li a span span i { vertical-align: middle; position: relative; top: -3px; font-size: 23px; } .sub_top_btn { position: fixed; bottom: 10px; right: 10px; z-index: 2; width: 80px; height: 80px; background: #028087; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; font-size: 12px; border-radius: 50% } .sub_top_btn i { font-size: 24px; margin-bottom: 0.25em; } .sub_top_btn svg { fill: #fff; font-size: 20px; margin-bottom: 0.25em; } .sub_top_btn.hold { } @media(min-width:1201px) { .cardList.attraction-type.course li:nth-child(8n+5) { transform:translateX(300%); } .cardList.attraction-type.course li:nth-child(8n+6) { transform:translateX(100%); } .cardList.attraction-type.course li:nth-child(8n+7) { transform:translateX(-100%); } .cardList.attraction-type.course li:nth-child(8n) { transform:translateX(-300%); } .cardList.attraction-type.course li:nth-child(8n+7):after { content: ''; position: absolute; left: -70%; right:70px; top:110px; height: 1px; border-top:5px dashed #ddd; z-index:-1; } .cardList.attraction-type.course li:nth-child(8n+6):after { content: ''; position: absolute; left: -70%; right:70px; top:110px; height: 1px; border-top:5px dashed #ddd; z-index:-1; } .cardList.attraction-type.course li:nth-child(8n+5):after { content: ''; position: absolute; left: -70%; right:70px; top:110px; height: 1px; border-top:5px dashed #ddd; z-index:-1; } .cardList.attraction-type.course li:nth-child(8n+1):after { content: ''; position: absolute; left: 70px; right:-70%; top:110px; height: 1px; border-top:5px dashed #ddd; z-index:-1; } .cardList.attraction-type.course li:nth-child(8n+2):after { content: ''; position: absolute; left: 70px; right:-70%; top:110px; height: 1px; border-top:5px dashed #ddd; z-index:-1; } .cardList.attraction-type.course li:nth-child(8n+3):after { content: ''; position: absolute; left: 70px; right:-70%; top:110px; height: 1px; border-top:5px dashed #ddd; z-index:-1; } .cardList.attraction-type.course li:nth-child(8n+4):after { content: ''; position: absolute; top: 79px; left: -125px; border-radius: 100%; border: 5px dashed #ddd; border-left: 0; border-top: 5px dashed transparent; border-bottom: 5px dashed transparent; width: 433px; height: 430px; z-index: -1; } .cardList.attraction-type.course li:nth-child(8n):after { content: ''; position: absolute; top:79px; left: 0px; border-radius: 100%; border: 5px dashed #ddd; border-right: 0; border-top: 5px dashed transparent; border-bottom: 5px dashed transparent; width: 433px; height: 430px; z-index:-1; } .cardList.attraction-type.course li:last-child:after { display:none; } } @media(min-width:1201px) and (max-width:1501px) { .cardList.attraction-type.course li a .img { width:200px; height: 200px; } .cardList.attraction-type.course li:nth-child(8n+4):after { width: 350px; height: 385px; left: -80px; } .cardList.attraction-type.course li:nth-child(8n+3):after { top:95px; } .cardList.attraction-type.course li:nth-child(8n+2):after { top:95px; } .cardList.attraction-type.course li:nth-child(8n+1):after { top:95px; left:100px; } .cardList.attraction-type.course li:nth-child(8n+5):after { top:95px; right:100px; } .cardList.attraction-type.course li:nth-child(8n+6):after { top:95px; } .cardList.attraction-type.course li:nth-child(8n):after { width:350px; height:385px; left: 20px; } .cardList.attraction-type.course li:nth-child(8n+7):after { top:95px; } } @media(max-width:1200px) { .cardList.attraction-type.course .ieLi li { flex: 0 1 25%; } } @media(max-width:768px) { .cardList.attraction-type.course .ieLi li { flex: 0 1 50%; } } /**/ /* 3-1 공연 */ .showList { } .showList ul li { margin-bottom: 60px; position: relative; } .showList ul li a { display: block; position: relative; } .showList ul li a:after { display: block; content: ''; clear: both; } .showList ul li a .img { float:left; width:600px; height: 378px; position: relative; overflow: hidden; margin-right:75px; } .showList ul li a .img img { width:100%; transition: all 0.5s ease; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .showList ul li a .info { overflow: hidden; padding-top:50px; transition: all 0.5s ease; } .showList ul li a .info dl dt { margin-bottom: 25px; } .showList ul li a .info dl dt b { display: block; font-size:15px; font-weight: 700; color: #00939b; margin-bottom: 10px; } .showList ul li a .info dl dt strong { display: block; font-size:40px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height:1.5; } .showList ul li a .info dl dd { font-size:16px; font-weight: 400; line-height: 1.6; color: #777 !important; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;} .showList ul li a .info dl dd p { color: #777 !important; } .showList ul li a .info dl dd p span { color: #777 !important; } .showList ul li a .icon { position: absolute; right:0; bottom:0; width:100px; height: 100px; border-radius:100%; transition: all 0.5s ease; display: flex; align-items: center; justify-content: center} .showList ul li a .icon svg { fill: #777; width: 40px; transition: all 0.5s ease;} .showList ul li a:hover .img img { transform:translate(-50%, -50%) scale(1.03); } .showList ul li a:hover .icon { transform: rotate(90deg); background: #00939b;} .showList ul li a:hover .icon svg {fill: #fff} .showListType2 { } .showListType2 ul li { padding-bottom: 50px; margin-bottom: 50px; border-bottom: 1px solid #d7d7d7; position: relative; } .showListType2 ul li a { display: block; position: relative; } .showListType2 ul li a:after { display: block; content: ''; clear: both; } .showListType2 ul li a .img { float:left; width:380px; position: relative; overflow: hidden; margin-right:55px; } .showListType2 ul li a .img img { width:100%; transition: all 0.5s ease; } .showListType2 ul li a .info { overflow: hidden; padding-top:45px; transition: all 0.3s ease; } .showListType2 ul li a .info dl dt { margin-bottom: 25px; } .showListType2 ul li a .info dl dt .time { display: inline-block; vertical-align: middle; padding:0 15px; height: 35px; line-height: 37px; font-size:17px; color: #00939b; border: 1px solid #00939b; border-radius:35px; font-weight: 700; margin-bottom: 15px; } .showListType2 ul li a .info dl dt .time i { font-size:20px; vertical-align: middle; margin:-2px 7px 0 0; } .showListType2 ul li a .info dl dt .time svg { font-size:16px; vertical-align: middle; margin:-4px 7px 0 0; fill: #00939b } .showListType2 ul li a .info dl dt .time.off { border-color:#f17c46; color:#f17c46; font-weight:400; } .showListType2 ul li a .info dl dt strong { display: block; font-size:36px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height:1.5; } .showListType2 ul li a .info dl dd { font-size:17px; line-height: 1.6; color: #777777; } .showListType2 ul li a .info dl dd svg { font-size:18px; margin-right: 5px;} .showListType2 ul li a .icon { position: absolute; right:0; bottom:0; width:100px; height: 100px; border-radius:100%; font-size:40px; display: flex; align-items: center; justify-content: center ;color: #777777; transition: all 0.5s ease; } .showListType2 ul li a .icon svg{transition: all .3s; fill: #777} .showListType2 ul li a:hover .icon {background: #00939b;transform: rotate(90deg);} .showListType2 ul li a:hover .icon svg {fill: #fff} .modalShow { } .modalShow .head { padding: 15px 30px; background: #00939b; position:relative; border-top-left-radius:10px; border-top-right-radius:10px; } .modalShow .head:after { display: block; content: ''; clear: both; } .modalShow .head .loc { max-width: 81px; display: inline-block; position: absolute; padding: 14px; background: #00747a; border-radius: 10px; font-size: 15px; line-height: 1.4; color: #fff; font-weight: 500; margin-left: 15px; text-align: center; top: 50%; transform: translateY(-50%); right: 30px; } .modalShow .head .h5 { overflow: hidden; font-size:35px; font-weight: 700; line-height: 1.4; color: #fff; padding:15px 0; } .modalShow .head dl { overflow: hidden; } .modalShow .head dl dt { font-size:35px; font-weight: 700; line-height: 1.2; margin-bottom: 10px; color: #fff; } .modalShow .head dl dd { font-size:16px; font-weight: 400; color: #fff; line-height: 1.4; } .modalShow .showSlider img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center} .modalShow .body { padding: 25px 50px 45px; background: #fff; } .modalShow .body .h4 { font-size:25px; font-weight: 700; padding-bottom: 20px; padding-top: 50px; position: relative; } .modalShow .body .h4 a { position: absolute; right:1px; bottom:21px; font-size:14px; } .modalShow .body .h4 a:after { content: ''; display: inline-block; vertical-align: middle; width:5px; height: 5px; border-left: 1px solid #000; border-bottom: 1px solid #000; transform: rotate(-135deg); margin:-1px 0 0 9px; } .modalShow .body .guideMap { margin-bottom: 10px; height:auto; } .modalShow .body .guideMap img { max-width:100%; } .modalShow .showTime { display: flex; justify-content: space-between; text-align: center; border-top:1px solid #000; padding:25px 15px 0; } .modalShow .showTime dl dt { } .modalShow .showTime dl dt b { display: block; font-size:12px; color: #00939b; font-weight: 700; } .modalShow .showTime dl dt strong { display: block; font-size:22px; font-weight: 400; padding:10px 0; } .modalShow .showTime dl dd { font-size:16px; line-height: 1.9; color: #777777; } .showMsg { background: #00939b; border-radius:10px; margin-top:-50px; margin-bottom: 20px; position: relative; font-size:18px; line-height: 1.5; color: #fff; word-break: keep-all; } .showMsg > div { padding:20px; } .showMsg i { position: absolute; left: 15px; top:22px; font-size:23px; } .showMsg p { padding-left: 22px; } /* 4 시설안내 */ .btnGuide { display: inline-block; vertical-align: middle; font-size:20px; white-space: nowrap; } .btnGuide svg { position: relative; top:2px; margin-right: 5px} .btnGuide:hover { color: #00939b; } .btnGuide:hover svg { position: relative; animation: bounce-i 1s infinite; fill: #00939b; } @keyframes bounce-i { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(-10px); } 60% { transform: translateY(-5px); } } .attr-info { line-height:30px; font-size: 16px} .attr-info .desc { font-size:18px; font-weight: 400; margin-bottom: 25px; line-height: 1.5; } .attr-info .desc strong { font-weight: 500; display:block; margin:20px 0 5px; } .attr-info table { width:100%; border-collapse: collapse; font-size:18px; line-height: 1.3; } .attr-info table th { font-weight: 700; text-align: left; padding:5px 0; } .attr-info table td { font-weight: 400; padding:5px 0; } .attr-info ol { padding: 20px 0 35px; } .attr-info ol li { font-size:16px; color: #777777; line-height: 1.5; margin-bottom: 8px; } .cardList.attraction-type.shopping ul li { flex-grow: 0;flex-shrink: 1;flex-basis: calc(33.3333% - 54px); padding: 0; margin-bottom: 58px; } .cardList.attraction-type.shopping ul li:nth-child(3n-2) { margin-right: 80px; margin-left: 0px; } .cardList.attraction-type.shopping ul li:nth-child(3n-1) { margin-right: 00px; margin-left: 0px; } .cardList.attraction-type.shopping ul li:nth-child(3n) { margin-right: 0px; margin-left: 80px; } .cardList.attraction-type.shopping ul li a .img { margin-bottom: 15px; } .cardList.attraction-type.facility ul li { flex-grow: 0;flex-shrink: 1;flex-basis: calc(33.3333% - 54px); padding: 0; margin-bottom: 58px; } .cardList.attraction-type.facility ul li:nth-child(3n-2) { margin-right: 80px; margin-left: 0px; } .cardList.attraction-type.facility ul li:nth-child(3n-1) { margin-right: 0px; margin-left: 0px; } .cardList.attraction-type.facility ul li:nth-child(3n) { margin-right: 0px; margin-left: 80px; } .cardList.attraction-type.facility ul li a .img { margin-bottom: 15px; } .cardList.attraction-type.facility ul { margin: 0; } /* 6 단체프로그램 */ .sub-description { padding: 65px 85px; background: #f9f9f9; margin-bottom: 130px; } .sub-description.sub-description-tpr { } .sub-description dl { display: flex; justify-content: space-between; } .sub-description dl dt { font-size:30px; line-height: 1.5; font-weight: 700; } .sub-description dl dd { font-size:18px; line-height: 1.8; font-weight: 400; } .groupBox { position:relative; z-index:1; } .groupBox::after { clear:both; display:block; content:''; } .groupImg { width:300px; max-width:100%; float:left; margin-right:100px; } .groupTxt { width:calc(100% - 400px); float:left; } .groupTxt h3 { font-size: 30px; line-height: 1.4; font-weight: 700; word-break: keep-all; margin-bottom:30px; } .groupTxt h4 { font-size: 25px; font-weight: 700; margin-bottom: 10px; margin-top:30px; } .groupTxt p { font-size: 18px; line-height: 1.8; font-weight: 400; } .sub-description .tit1 { font-size:25px; font-weight: 700; margin-bottom: 10px; position: relative; } .program-desc { padding-top:30px; border-top:2px solid #000; } .program-desc .text { font-size:20px; line-height: 1.8; } .program-desc .text2 { font-size:20px; line-height: 1.8; margin-bottom: 30px; } .program-desc .text2 p { font-size:22px; font-weight: 500; } .program-desc .text3 { font-size:20px; line-height: 1.8; padding: 0 60px 30px; } .program-list { } .program-list ul { border-top:2px solid #000; margin-bottom: 55px; } .program-list ul li { border-bottom: 1px solid #d7d7d7; } .program-list ul li a { display: block; padding:35px 30px 35px 350px; position: relative; min-height: 185px; } .program-list ul li a.none { cursor: default; } .program-list ul li a .img { position: absolute; left: 0; top:35px; width:300px; } .program-list ul li a .img img { width:100%; } .program-list ul li a .info { padding-top:18px; } .program-list ul li a .info dl { margin-bottom: 30px; position:relative; } .program-list ul li a .info dl dt { font-size:30px; font-weight: 700; margin-bottom: 10px; } .program-list ul li a .info dl dd { font-size:20px; color: #777777; font-weight: 400;word-wrap:break-word; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; height:54px;line-height:27px; } .program-list ul li a .info .etc { display: flex; justify-content: space-between; align-items: center; } .program-list ul li a .info .etc div:first-child { font-size:17px; color: #777777; font-weight: 400; } .program-list ul li a .info .etc div i { font-size:20px; color: #00939b; margin:0 2px 0 0; } .program-list ul li a .info .etc div .button { display: inline-block; vertical-align: middle; padding: 0 30px; height: 38px; line-height: 36px; border: 1px solid #000; font-size:17px; color: #000; border-radius:38px; } .program-list ul li a .info .etc div .button:hover { color:#fff; background-color:#00939b; transition:.3s; border: 1px solid #00939b; } .program-list.theme-type ul li a .info { padding-top:23px; } .program-list.theme-type ul li a .info dd { line-height: 27px; } .customer-team { margin-bottom: 70px; } .customer-team .h5 { font-size:22px; font-weight: 700; margin-bottom: 15px; } .customer-team dl { padding: 25px 30px; background: #f9f9f9; } .customer-team dl dt { font-size:20px; margin-bottom: 15px; } .customer-team dl dd { font-size:0; } .customer-team dl dd div { display: inline-block; vertical-align: middle; font-size:20px; margin-right:20px; } .customer-team dl dd div strong { font-weight: 700; color: #00939b; } .ticket-type { text-align: center; margin-bottom: 40px; } .ticket-type > div { display: inline-block; vertical-align: top; margin:0 70px 40px; } .ticket-type > div dl { padding-top:25px; } .ticket-type > div dl dt { font-size:22px; font-weight: 700; margin-bottom: 10px; } .ticket-type > div dl dd { font-size:20px; line-height: 1.55; font-weight: 400; } .tour-list { margin-bottom: 100px; } .tour-list ul:after { display: block; content: ''; clear: both; } .tour-list ul { margin:0 -35px; display: flex; flex-wrap: wrap; } .tour-list ul li { flex:0 1 33.33333%; box-sizing: border-box; padding:0 35px; margin-bottom: 65px; } .tour-list ul li .item .photo { } .tour-list ul li .item .photo img { width:100%; } .tour-list ul li .item dl dt { font-size:25px; font-weight: 700; padding:18px 0 13px; } .tour-list ul li .item dl dd { font-size:20px; line-height: 1.55; color: #777777; font-weight: 400; } .way { padding: 40px 60px; background: #f9f9f9; margin-bottom: 30px; } .way .h5 { margin-bottom: 28px; } .way .h5 span { display: inline-block; vertical-align: middle; padding:0 21px; height: 37px; line-height: 35px; border: 1px solid #00939b; font-size:18px; color: #00939b; border-radius:37px; box-sizing: border-box; } .way ul { font-size:0; margin-left:-10px; } .way ul li { display: inline-block; vertical-align: top; padding-left:20px; margin-left: 10px; position: relative; font-size:20px; line-height: 1; text-align: center; margin-bottom: 30px; } .way ul li span { display: block; padding-top:10px; font-size:18px; color: #777777; line-height: 1; } .way ul li:before { content: ''; position: absolute; left: 0; top:6px; width:7px; height: 7px; border-left: 2px solid #00939b; border-bottom: 2px solid #00939b; transform: rotate(-135deg); } .way ul li:first-child { padding-left: 0; } .way ul li:first-child:before { display: none; } .attrBest::after {clear:both;display:block;content:''; } .attrBest li {float:left;width:calc(33.3333% - 27px);box-sizing: border-box; margin-bottom: 58px; } .attrBest li:nth-child(3n-2) { margin-right: 40px; margin-left: 0px; } .attrBest li:nth-child(3n-1) { margin-right: 0; margin-left: 0; } .attrBest li:nth-child(3n) { margin-right: 0px; margin-left: 40px; } .attrBest li .img {margin-bottom: 15px; } .attrBest li .dc {font-weight:bold;font-size:18px; } /* 서울랜드 소개 */ .greeting { overflow:hidden; } .greeting .h3 { padding-top:140px; position: relative; font-size:35px; font-weight: 700; margin-bottom: 100px; text-align: center; } .greeting .h3:before { content: ''; position: absolute; left: 50%; top:0; width:1px; height: 100px; background: #00939b; } .greeting .txt1 { font-size:90px; line-height: 1; color: #f0f0f0; font-weight: 700; position: relative; display: inline-block; vertical-align: top; margin-bottom: -10px; } .greeting .txt1:before { content: ''; position: absolute; right:-24px; top:10px; width:15px; height: 15px; border-radius:100%; background: #00939b; animation: introDotted 1s linear infinite alternate; } .greeting .txt2 { font-size:30px; font-weight: 700; line-height: 1.4; margin-bottom:25px; position: relative; z-index:2; } .greeting .txt3 { font-size:20px; line-height: 1.8; position: relative; z-index:2; } .greeting .txt3 p { font-weight: 500; padding-top:35px; } .greet-txt1 { margin-bottom: 130px; } .greet-txt1 .txt1 { margin-left: 20px; } .greet-txt2-box { padding:0 9% 0 31%; margin-bottom: 180px; } .greet-txt2 { text-align: right; } .greet-txt2 .txt1 { margin-right:70px; } .greet-txt2 .txt3 { text-align: left; } .greet-txt3-box { position: relative; padding-left:550px; margin-bottom: 200px; } .greet-txt3-box .greet-img3 { position: absolute; left:-260px; bottom:-58px; } .greet-txt3-box .txt1 { margin-left: 80px; } .greet-txt4-box { padding-left:8.5%; } .greet-txt4-box .greet-img4 img { width:100%; } .greet-txt4-box .txt1 { margin-left: 320px; } .greet-txt4-box .txt3 { margin-bottom: 40px; } @keyframes introDotted { 0% { transform:translateY(0); } 100% { transform:translateY(10px); } } .history { } .history .head { padding:130px; margin-top: 50px; text-align:center; background: url(../images/introduce/img_history.png) no-repeat 50% 50%; background-size:cover; position: relative; margin-bottom: 170px; font-size:35px; font-weight: 700; color: #fff; } .history .head:before { content: ''; position: absolute; left: 50%; bottom:0; width:1px; background: #fff; height: 90px; } .history .head:after { content: ''; position: absolute; left: 50%; bottom:-70px; width:1px; background: #00939b; height: 70px; } .history ul { max-width:1200px; margin: 0 auto; } .history ul li { padding-left: 320px; position: relative; border-bottom: 1px solid #e2e2e2; padding-bottom: 35px; margin-bottom: 25px; } .history ul li:before { content: ''; position: absolute; left: 0; bottom:-1px; height: 1px; width:225px; background: #3c3c3c; } .history ul li strong { position: absolute; left: 15px; top:0; font-size:25px; font-weight: 700; } .history ul li dl:after { display: block; content: ''; clear: both; } .history ul li dl { font-size:17px; line-height: 1.8; color: #777777; } .history ul li dl + dl { margin-top:2px; } .history ul li dl dt { float:left; width:75px; font-size:20px; color: #000; } .history ul li dl dd { overflow: hidden; } .history ul li dl dd span { color: #00939b; } .history ul li:last-child { border-bottom: 0; } .history ul li:last-child:before { display: none; } .character { max-width:900px; margin: 140px auto 0; } .character .intro { text-align: center; padding-bottom: 100px; margin-bottom: 100px; border-bottom: 1px solid #d7d7d7; } .character .intro dl { display: inline-block; vertical-align: top; text-align: left; padding:15px 60px 0 0; } .character .intro dl dt { font-size:40px; font-weight: 700; margin-bottom: 20px; } .character .intro dl dd { font-size:20px; line-height: 1.7; } .character .intro div { display: inline-block; vertical-align: top; } .character .etc { text-align: center; } .music-list { } .music-list ul { border-top:2px solid #000000; } .music-list ul li { padding:30px 320px 30px 40px; border-bottom: 1px solid #d7d7d7; position: relative; } .music-list ul li .title { font-size:20px; } .music-list ul li .title i { font-size:23px; color: #00939b; margin-right:10px; vertical-align: middle; margin-top:-5px; } .music-list ul li .btns { position: absolute; right:40px; top:50%; margin-top:-16px; } .music-list ul li .btns a { height: 33px; line-height: 31px; font-size:16px; width:129px; min-width: inherit; padding: 0; margin-left: 10px; } .music-list .h5 { font-size:20px; font-weight: 500; margin-bottom: 20px; } .music-list ul + .h5 { margin-top:65px; } .marketing { margin-bottom: 70px; } .marketing .head { text-align: center; margin-bottom: 100px; padding-top:40px; } .marketing .head h4 { font-size:35px; font-weight: 700; margin-bottom: 20px; } .marketing .head div { font-size:20px; line-height: 1.4; } .marketing .list ul { border-top:2px solid #000; } .marketing .list ul li { border-bottom: 1px solid #d7d7d7; padding: 35px 0; overflow: hidden; } .marketing .list ul li .img { float:left; width:278px; margin-right:32px; } .marketing .list ul li .img img { width:278px; height:183px; } .marketing .list ul li .info { overflow: hidden; padding-top:20px; } .marketing .list ul li .info h5 { font-size:30px; font-weight: 700; margin-bottom: 18px; } .marketing .list ul li .info p { font-size:20px; line-height: 1.5; color: #777777; padding-left: 12px; text-indent: -12px; } .marketing .list ul li .info p + p { margin-top:4px; } .marketing .list ul li .info .flex { align-items: baseline; } .marketing .list ul li .info .flex div { flex: 1 1 auto; } .sponser { margin-bottom: 70px; } .sponser .head { text-align: center; margin-bottom: 100px; padding-top:40px; } .sponser .head h4 { font-size:35px; font-weight: 700; margin-bottom: 20px; } .sponser .head div { font-size:20px; line-height: 1.4; } .sponser .list ul { display: flex; flex-wrap: wrap; margin:0 -35px; } .sponser .list ul li {flex-grow: 0;flex-shrink: 1;flex-basis: calc(33.3333% - 70px);margin:0 35px;padding:0 0 45px;text-align: center;box-sizing: border-box; } .sponser .list ul li .item .img img { width:100%; } .sponser .list ul li .item .logo { padding: 14px 0 8px; } .sponser .list ul li .item .subj { font-size:20px; } /* 검색결과 */ .search-result { padding-top: 25px; } .search-result .search { text-align: center; margin-bottom: 130px; } .search-result .search div { display: inline-block; vertical-align: top; background-color: #f1f1f1; border-radius: 80px; padding-left: 20px} .search-result .search div .inp-srch { width:450px; height: 60px; font-size:22px; font-weight: 500; vertical-align: middle; box-sizing: border-box; border: 0; background: none; font-family: 'Pretendard'; padding: 0; background-color: transparent; padding-left: 20px} .search-result .search div .inp-srch::-webkit-input-placeholder { color: #ababab;} .search-result .search div .inp-srch:-ms-input-placeholder { color: #ababab;} .search-result .search div .btn-srch { display: inline-flex; align-items: center; justify-content: center ;vertical-align: middle; width:60px; height: 60px; border-radius:100%; text-align: center; font-size:28px; color: #fff; box-sizing: border-box; border: 0; background: #00939b; } .search-result .search div .btn-srch svg {fill: #fff} .search-result .result-hit { text-align: right; margin-bottom: 20px; font-size:19px; margin-top:-40px; } .search-result .result-hit strong { color: #00939b; font-weight: 500; } .search-result .btn-board { display: block; position: relative; padding-right:95px; line-height: 1.4; } .search-result .btn-board p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:19px; } .search-result .btn-board em { position: absolute; right:0; top:0; font-size:17px; color: #ababab; } .contentDescription .result-ul { border-top:2px solid #000; } .contentDescription .result-ul li { padding: 23px 60px; border-bottom: 1px solid #d7d7d7; position: relative; } .contentDescription .result-ul li .path a { display: inline-block; vertical-align: middle; font-size:19px; color: #000; } .contentDescription .result-ul li .path a:after { content: ''; display: inline-block; vertical-align: middle; width:10px; height: 10px; border-left: 1px solid #000; border-bottom: 1px solid #000; transform: rotate(-135deg); margin:-4px 13px 0; } .contentDescription .result-ul li .path a:first-child { font-size:22px; } .contentDescription .result-ul li .path a:last-child:after { display: none; } .contentDescription .result-ul li .path.active a { color: #00939b; } .contentDescription .result-ul li .path.active a:after { border-color:#00939b; } .tel1 p { display: inline-block; vertical-align: middle; margin-right:33px; } .tel1 p strong { font-weight: 700; color: #00939b; } .tblArea.partner-type table thead th { padding-left: 0; padding-right:0; text-align: center; } .tblArea.partner-type table tbody td { padding-left: 10px; padding-right:10px; text-align: left; font-size:17px; font-weight: 400; } .calendar { background-image: url(../images/common/ico_cal.png); background-repeat: no-repeat; background-position: right 35px center; } .hp-box { display: flex; justify-content: space-between; align-items: center; } .hp-box input { flex:1; } .hp-box span { flex: 0 0 30px; text-align: center; font-size:20px; } .hp-box.type2 { padding-right:33%; } .date-box { display: flex; justify-content: space-between; align-items: center; } .date-box input { flex:1; } .date-box input:first-child { margin-right:15px; } .date-box > div { position:relative; } .date-box.date-box-full > div { width:100%; } .date-box > div:first-child { margin-right:15px; } .date-box > div > i { position:absolute; top:50%; right:30px; transform:translateY(-50%); color:#00939b; font-size:24px; } .season-list { padding-top:35px; border-top:2px solid #000; } .season-list ul:after { display: block; content: ''; clear: both; } .season-list ul li { float:left; margin: 0 45px 45px 0; } .season-list ul li dl { padding-top:20px; } .season-list ul li dl dt { display: inline; font-size:30px; font-weight: 700; margin-right:6px; } .season-list ul li dl dd { display: inline; font-size:20px; color: #777777; } .promotionList .swiper-slide { text-align:center; padding:5px; box-sizing:border-box; } .promotionList .swiper-slide a { display:block; height:230px; border:1px solid #ebebeb; box-sizing:border-box; } .promotionList .swiper-slide dl { padding:15px 10px; box-sizing:border-box; } .promotionList .swiper-slide dt { font-size:16px; line-height:1.4; font-weight: 700; } .promotionList .swiper-slide dt strong { word-break:keep-all; } .promotionList .swiper-slide dd { font-size:14px; color:#787878; font-weight:400; margin-top:8px; } /* 개인정보처리방침 */ .listType10 .ul01:after { display:block; content:''; clear:both; } .listType10 .ul01 { padding:15px; background:#f9f9f9; border-radius:10px; } .listType10 .ul01 li { float:left; width:50%; box-sizing:border-box; padding:5px; } .listType10 .ul01 li a { transition:all 0.5s ease; } .listType10 .ul01 li a:hover { color:#f17c46; } .modalCard .listType10 dl dd { font-size:15px; } .listType10 dl dd .ul02 .li01 { padding-left:95px; text-indent:-95px; } .listType10 dl dd .ul02 li { position:relative; } .listType10 dl dd .ul02 li:before { content:'-'; display:inline; margin-right:5px; } .listType10 dl dd .ul02 li strong { font-weight:500; } .listType10 dl dd .ul03 li { padding-left:15px; text-indent:-15px; } .listType2 { } .listType2 table { width:100%; border-collapse:collapse; border-top:2px solid #000; } .listType2 table caption { display:none; } .listType2 table thead th { text-align:center; font-size:16px; font-weight: 700; padding:10px 0; border-bottom:1px solid #eee; } .listType2 table tbody td { text-align:center; font-size:15px; font-weight:400; padding:10px 5px; color:#777; border-bottom:1px solid #eee; width:50%; } .listType2 table tbody td + td { border-left:1px solid #eee; } .listTypeMovie table { width:100%; border-collapse:collapse; border-top:2px solid #000; } .listTypeMovie table caption { display:none; } .listTypeMovie table thead th { text-align:center; font-size:16px; font-weight: 700; padding:10px 0; border-bottom:1px solid #eee; } .listTypeMovie table tbody td { text-align:center; font-size:15px; font-weight:400; padding:10px 5px; color:#777; border-bottom:1px solid #eee; } .listTypeMovie table tbody td + td { border-left:1px solid #eee; } .inp-desc.mobile { display: none !important; } .mobile { display: none !important; } .price-table {display:inline-block;width:40%;vertical-align:top; } .price-table:last-child {margin-left: calc(20% - 4px); } .price-table strong {font-weight:700;font-size:13px; line-height: 16px; } .price-table-sale {font-size:12px; } .cardModalLink {display:none; } .schedule .inner { padding: 0 15px; } .schedule .footer {display:none} .schedule .showMsg { margin-bottom: 0; margin-top: 30px; } .schedule header { display: flex; height: 60px; padding: 0 15px; align-items: center; justify-content: space-between; } .schedule header .LogoArea { background: url(../images/common/img_logo_footer.svg)no-repeat; text-indent: -9999px; display: block; width: 100px; height: 30px; margin-top: 12px; } .schedule header .f5 { background-color: transparent; border: none; font-size: 20px; margin-top: 10px; } .schedule .todayTime { border-top: none; } .schedule .cont-02, .schedule .cont-03 { border-top: 10px solid #f8f8f8; padding: 60px 0 30px; } .schedule .todayTime{ padding:0px; } .schedule .todayTime .today { background-color: #f8f8f8; padding: 35px 0; } .schedule .todayTime .times { background-color: #fff; margin-top: 0; padding: 35px 0; } .schedule .title p { font-size: 22px; margin-bottom: 20px; font-weight:700; } @media (min-width:1201px) { .sortBtns a:hover { color: #f17c46; border-bottom-color:#f17c46; } } @media all and (max-width:1660px) { .container.reservation .inner .imgApp { top:250px; } .container.reservation .inner .imgApp img { width:350px; } } @media all and (max-width:1366px) { .container .containerInner {padding: 70px 40px 150px; } .container.reservation .containerInner {padding: 0px 0px 30px; } .container.reservation .contentsInner .topSection {padding-top: 60px; } .subVisual {padding: 0 40px 0 120px; } /*.guideMapName {height: 50px;font-size: 20px;line-height: 50px;padding: 0 25px 0 20px; } */ .guideMapSize button {width: 50px; height: 50px; } .guideMapSize button i {font-size: 26px; } .sortBtns a {margin-bottom:20px; } .container.reservation .inner .imgApp { left: -60px; } .seasonPass .grayBox h3 { font-size:23px; line-height:1.4; } .seasonPass .grayBox p { font-size:16px; line-height:1.6; margin-top:15px; } .seasonPass .grayBox.seoulland { background:none; padding-top:320px !important; position:relative; text-align:center; } .seasonPass .grayBox.seoulland:before { content:''; position:absolute; left:-15px; right:-15px; top:80px; height:200px; background:#f9f9f9; } .seasonPass .grayBox.seoulland:after { content: ''; position: absolute; font-weight: 100; width: 150px; height: 300px; left: 50%; transform: translateX(-50%); background: url(../images/season_pass/img_pass1.png) no-repeat 0 0; background-size: cover; top: -20px; } .seasonPass .grayBox.dulmoa { background:none; padding-top:320px !important; position:relative; text-align:center; } .seasonPass .grayBox.dulmoa:before { content:''; position:absolute; left:-15px; right:-15px; top:80px; height:200px; background:#f9f9f9; } .seasonPass .grayBox.dulmoa:after { content:''; position:absolute; top:-50px; width:150px; height:300px; left:50%; transform:translateX(-50%); background:url(../images/season_pass/img_pass2.png) no-repeat 0 0; background-size:cover; top: -20px; } .seasonPass .grayBox.damoa { background:none; padding-top:320px !important; position:relative; text-align:center; } .seasonPass .grayBox.damoa:before { content:''; position:absolute; left:-15px; right:-15px; top:80px; height:200px; background:#f9f9f9; } .seasonPass .grayBox.damoa:after { content:''; position:absolute; top:0; width:150px; height:300px; left:50%; transform:translateX(-50%); background:url(../images/season_pass/img_pass3.png) no-repeat 0 0; background-size:cover; top: -20px; } .grayBox { padding:15px !important; display:block; margin-bottom:20px; } .lostArticle .modal-container .grayBox.grayBoxBg01 { padding:50px 50px 40px 50px !important; } .cardList.attraction-type.attraction-maintain ul li, .cardList.attraction-type.attraction-desc ul li, .cardList.attraction-type.shopping ul li, .cardList.attraction-type.facility ul li { flex-basis: calc(33.3333% - 20px);} .cardList.attraction-type.attraction-maintain ul li:nth-child(3n-2), .cardList.attraction-type.attraction-desc ul li:nth-child(3n-2), .cardList.attraction-type.shopping ul li:nth-child(3n-2), .cardList.attraction-type.facility ul li:nth-child(3n-2) {margin-right: 30px;} .cardList.attraction-type.attraction-maintain ul li:nth-child(3n), .cardList.attraction-type.attraction-desc ul li:nth-child(3n), .cardList.attraction-type.shopping ul li:nth-child(3n), .cardList.attraction-type.facility ul li:nth-child(3n) {margin-left: 30px;} } @media all and (max-width:1200px) { .pc { display: none !important; } .mobile { display:block !important; } span.mobile { display: inline !important; } .bottom-btns i.mobile { display:inline-block !important; } .next-line-1200-400 { display:block; } .mobile-margin { margin:0 -15px; } .f14 { font-size:12px !important; } .f20 { font-size:12px !important; } .f25 { font-size:13px !important; } .mobile-h3 { font-size:15px; font-weight:500; margin-bottom:15px; } .mb20 { margin-bottom: 13px !important; } .mb30 { margin-bottom: 15px !important; } .mb40 { margin-bottom: 20px !important; } .mb50 { margin-bottom: 25px !important; } .mb60 { margin-bottom: 30px !important; } .mb70 { margin-bottom: 35px !important; } .mb80 { margin-bottom: 40px !important; } .mb90 { margin-bottom: 45px !important; } .mb100 { margin-bottom: 50px !important; } .table_txt_mg {margin-bottom: 13px !important;} .sortBtns.mobile-tab.mb35 {margin-top:30px; } .sortDesc { font-size:11px; } /* OVERRIDE */ .container { position: relative; min-height:inherit; } .container .containerInner { padding:0px 0 70px; } .tblArea .tblType th { font-size:12px; padding:15px 5px; } .tblArea .tblType td { font-size:13px; padding:15px 5px; } .contact1 .tblArea .tblType td { font-size:12px; padding:15px 5px; line-height: 17px; } .tblArea .tblType.col th, .tblArea .tblType.col td { font-size:12px; padding:15px 5px; } .tblType.row tbody th, .tblType.row tbody td { vertical-align: middle; line-height: 1.5; word-break: keep-all; border-color:#e8e8e8; } .sm {font-size: 10px;} .tblArea .tblType th, .tblArea .tblType td { border-color:#e8e8e8; } .priceBox1 dl { border-bottom: 1px solid #e8e8e8; } .tblArea .tblType td p.subDesc { font-size:13px; } .priceEtc {font-size: 12px; } .tblArea .tblType th.text-center, .tblArea .tblType td.text-center { padding-left:5px; padding-right:5px; } .tblArea.mobile-padding .tblType th, .tblArea.mobile-padding .tblType td { padding-left: 30px; padding-right:30px; } .bottom-btns { display: block; } .bottom-btns .btn-type1, .bottom-btns .btn-type2 { min-width:inherit; } .bottom-btns .btn-type1 { width:100%; padding:0; margin-bottom:15px; } .bottom-btns .btn-type1 { height:45px; line-height:45px; border:none; border-radius:5px; background-color:#f6f6f6; font-size:14px; } .bottom-btns .btn-type1 > i { margin-top:3px; } .bottom-btns > a, .bottom-btns > button { margin:0 2px; } .bottom-btns.pc { display:none; } .listType.bulType li { font-size:13px; line-height: 1.5; margin-top:12px; } .listType.bulType li::before { top:8px; width:4px; height: 4px; } /* MODAL */ .modal-dialog { padding:0 15px; } .modal-content .btn-close { width:40px; height: 40px; font-size:18px; line-height: 40px; padding:0; } .modal-content { padding-top:50px; } .modal-header { height: 50px; padding-left: 15px; } .modal-header .h5 { font-size:18px; } .modal-body { border-radius:10px; } .modal .swiper-pagination { bottom:15px; } .modal .swiper-pagination-bullet { width:6px; height: 6px; margin:0 2px; } .modal .swiper-pagination-bullet.swiper-pagination-bullet-active {width: 15px} .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 3px} /* Button */ .btn-type1 { height: 50px; line-height: 48px; font-size:15px; padding:0 15px; min-width:160px; border-radius:0; } .btn-type2 { height: 5px; line-height: 48px; font-size:15px; padding:0 15px; min-width:160px; border-radius:0; } .btn-type1 .xi-download { display: inline; font-size:20px; vertical-align: middle; position: relative; top:-3px; } .containerInner .inner { padding:0px 20px; } .titWant.titWantAll { margin:40px 0 30px; font-size:18px; } .mainCalenda.mainCalendaTime .calendaDay { height:60px; } .mainCalenda.mainCalendaTime .calendaDay strong { line-height: 60px; } .ico-scroll { text-align: center; padding:30px 0; } .ico-scroll img { width:25px; } .todayTime .times div strong {width: 50px;height: 65px;line-height: 65px;font-size: 30px; } .guideMapMark {height: auto; padding: 15px 0px 15px 25px; width: 260px} .guideMapMark ul { display: flex; flex-wrap: wrap} .guideMapMark li { position:relative; line-height: 1.5 ;margin-right:25px; padding-left:20px; width: calc(50% - 40px); text-align: left; min-width: 90px} .guideMapMark ul::after {display: none} .guideMapMark li:nth-child(2n) {margin-right: 0; width: auto; min-width: 0} .attrBest li {float:none;width:100%;margin-bottom: 45px; } .attrBest li:nth-child(3n-2) {margin-right: 0px;margin-left: 0px; } .attrBest li:nth-child(3n-1) {margin-right: 0;margin-left: 0; } .attrBest li:nth-child(3n) {margin-right: 0px;margin-left: 0px; } .attrBest li .img {margin-bottom: 15px;position: relative; } .attrBest .dc {display:none; } .attrBest li .img span {position: absolute;left: 0;right: 0;bottom: 0;padding: 15px;background: rgba(0,0,0,0.6);text-align: right;font-size: 14px;color: #fff; } .attrBest li .img img {width:100%; } .board-head { flex-direction: column-reverse; align-items: baseline; margin-bottom: 15px; margin-top: 30px; } .board-head.board-head-nm { margin-top:12px; margin-bottom: 30px; } .board-head.board-head-sm { margin-bottom: 10px; } .board-head.board-head-sw { margin-top:60px; } .board-head .h3 { font-size:14px; } .board-head .left { } .board-head .right { width:260px; margin: 0 auto 40px; } .board-head .left.mobile-block { display: block; width:100%; } .board-head.mobile-margin { padding-left:15px; padding-right:15px } .board-head .srch-box .inp-srch { padding-left: 10px; font-size:12px; width:220px !important; letter-spacing:-0.5px; background: transparent; } .board-head.borderBottom { border-bottom:0; margin-bottom: 15px; padding-bottom: 10px; } .board-head.borderBottom .right { margin-bottom:0; } .board-head .srch-box .btn-srch { padding:0; } .board-head .srch-box {background: #f8f8f8;border-radius: 25px; } .search-result .search div {background: #f8f8f8;border-radius: 25px; } .sortBtns.mobile-tab.mb20 {margin-top:28px; } .notice-list { margin:0 -20px 30px; } .notice-list ul { display: block; margin: 0; border-top: 10px solid #f0f0f0; } .notice-list ul li { padding:22px 20px; border-bottom: 1px solid #f0f0f0; width:100%; flex-basis: 100%; box-sizing: border-box; } .notice-list ul li a { padding: 0; border: 0; } .notice-list ul li a dl:before { display: none; } .notice-list ul li a dl dt { font-size: 16px; line-height: 1.5; height: auto; margin-bottom: 15px; font-weight: 500; } .notice-list ul li a dl dd { display: none; } .notice-list ul li a i { display: none; } .notice-list ul li a .icon { display: none; } .notice-list ul li a { transition: none; } .notice-list ul li a:hover { border:none !important; outline:none !important; box-shadow:none !important; } .notice-list ul li a p { font-size:11px; } .notice-view .head:before { display: none; } .notice-view { padding-top: 30px; } .notice-view .head { padding:0 0 20px; } .notice-view .head .h4 { font-size:25px; margin-bottom: 15px; } .notice-view .head .date { font-size:13px; } .notice-view .head .snsBox .btnShare { font-size:20px; } .notice-view .body { margin-bottom: 50px; } .notice-view .body .text-area { padding:20px 0; font-size:14px; } .notice-view .body .text-area img { max-width:100%; height: auto !important; } .notice-view .body .files { padding:15px 20px; } .notice-view .body .files dl { font-size:14px; } .promotionView { padding:30px 0; } .promotionView .date { padding:15px; font-size:14px; margin-bottom: 30px; } .tabArea { padding-bottom: 30px; padding-top:20px; } .tabArea.tabArea-full { width: calc(100% + 40px); margin: 0 -20px; } .tabArea ul { display: flex; justify-content: space-between; margin:0; width:auto; white-space:nowrap; overflow:auto; } .tabArea ul li { margin: 0; flex:1 1 auto; } .tabArea ul li a { display: block; font-size:17px; border-bottom: 1px solid #d7d7d7; text-align: center; line-height: 40px; padding:0 20px; } .tabArea ul li.current:before { display: none; } .tabArea ul li.current:after { content: ''; position: absolute; left: 0; right:0; bottom:0; height: 3px; background: #00939b; } .contactMap { height: 250px; margin: 0 0px 25px -20px; width: 100vw; } .contact1 .addr { margin-bottom: 30px; } .contact1 .addr span { font-size:18px; margin-right:5px; line-height: 27px; } .contact1 .addr .btn-type1 { display: none; } .contact1 .train { position: relative; font-size:12px; line-height: 1.4; margin-bottom:15px; } .contact1 .train svg { font-size: 16px; flex-shrink: 0} .elephantDesc { padding:20px 20px 70px; background-position: 100% 90%; background-size:auto 70px; } .elephantDesc dl dt strong { font-size:30px; } .elephantDesc dl dt p { font-size:20px; padding:14px 0 15px; } .elephantDesc dl dd { font-size:14px; } .contentDescription.con_ticket { padding-top:30px; } .contentDescription > li { display: block; margin-bottom: 50px; } .contentDescription > li .body { width:auto; } .contentDescription > li .head:before { font-size:14px; } .contentDescription > li .head { margin-bottom: 10px; } .contentDescription > li .head.head-mg { margin-bottom: 10px; margin-top:40px; } .contentDescription > li .head .h4 { font-size:22px; } .contentDescription > li .head .h4 div { font-size:22px; } .contentDescription > li .head .h4 br { display: none; } .contentDescription > li .head .h4 small { font-size:13px; padding:0; } .contentDescription > li .body .mapDesc { font-size:14px; line-height: 1.5; padding:0; } .tabArea + .inner .contentDescription > li .body .tblArea {overflow: auto} .tabArea + .inner .contentDescription > li .body .tblType {min-width: 400px} .description1 { padding:15px; } .description1 dl { font-size:12px; } .faqArea li { } .faqArea li a.question { border-bottom: 1px solid #e8e8e8; padding: 20px 65px 20px 55px; text-indent: 0; font-size:15px; position: relative; line-height: 1.4; } .faqArea li a.question i { right:10px; font-size:15px; width:30px; height:30px; line-height:30px; text-align:center; top:50%; margin-top:-15px; } .faqArea li.current a.question i { right:10px; width:30px; height:30px; line-height:30px; top:50%; margin-top:-15px; } .faqArea li a.question:before { padding: 0; position: absolute; left: 10px; top:15px; } .faqArea li div.answer { padding:15px 10px 15px 50px; text-indent:0; font-size:14px; line-height: 1.4; position: relative; } .faqArea li div.answer:before { position: absolute; left: 10px; top:9px; } .faqArea li div.answer p { line-height: 25px; } .description2 { text-align: left; padding:15px; } .description2 dl { display: block; font-size:14px; padding:4px 0; } .description3 div { font-size:11px; padding-left: 13px; line-height: 1.7; } .guideWrap.mobile { margin: 30px -20px 15px -20px; border-bottom: 10px solid #f0f0f0; white-space: nowrap; overflow: auto; padding-bottom: 20px; } .guideWrap.mobile .guideTabs { margin-bottom: 10px; } .guideTabs a { width:auto; padding:0 12px; flex: 1 0 65px; padding:0; } .guideTabs a:before { width:80px; height: 80px; background-size:40px auto; } .guideTabs a p { font-size: 14px; } .guideTabs a p:after { display: none; } .guideMapBtns { margin:0 -20px 30px -10px; } .guideMapBtns.mobile { position:static; } .guideMapBtns ul { white-space:nowrap; overflow:auto; } .guideMapBtns ul li { padding:0 3px 12px; } .guideMapBtns ul li a { height: 30px; line-height: 30px; font-size:12px; padding:0 13px; } .guideMap { margin:0 -15px; } .shopList ul li a { display: block; padding:25px 0; } .shopList ul li a .info { padding-left: 0; padding-top:15px; } .shopList ul li a .info .tit { font-size:20px; margin-bottom: 10px; } .shopList ul li a .info .txt { font-size:15px; margin-bottom: 12px; } .shopList ul li a .info .loc { padding-left: 70px; } .shopList ul li a .info .loc span { padding:0 15px; font-size:13px; line-height: 23px; } .shopList ul li a .info .loc p { font-size:14px; line-height: 23px; } .pays { margin:-5px; } .pays div { width:33.33333%; padding:5px; margin:0; box-sizing: border-box; } .priceBox1 { display: block; margin: 0 0 15px; } .priceBox1 dl { margin:0; padding:15px 10px; } .priceBox1 dl + dl { border-top:0; } .priceBox1 dl dt { font-size:16px; margin-bottom: 10px; } .priceBox1 dl dd div { font-size:14px; padding-left: 12px; } .priceBox1 dl dd div:before { top:8px; width:4px; height: 4px; } .sortBtnsInner { padding:0 20px; } .sortBtns { text-align: center; padding-right:30px; } .sortBtnsWrapRec .sortBtns { text-align: left; } .sortBtns a { font-size:16px; margin:0 16px 0 0; } .sortBtns.scrollType { white-space: nowrap; text-align: left; overflow: auto; } .sortBtns.scrollType a { margin:0 8px; } .sortBtns.scrollType a:first-child { margin-left: 15px; } .sortBtns.scrollType a:last-child { margin-right: 15px; } /*.sortBtns.mobile-tab { display: flex; flex-wrap: wrap; margin-bottom: 20px; } */ .sortBtns.mobile-tab { margin-bottom: 5px; white-space: nowrap; overflow: auto; -ms-overflow-style: none; scrollbar-width: none; } .sortBtnsWrap { position:relative; } .sortBtnsWrap_du { position:relative; } /*.sortBtns.mobile-tab a { width:33.3333333%; height: 45px; line-height: 43px; border:1px solid #ddd; margin:0; box-sizing: border-box; display: block; padding: 0; font-size:13px; color: #777777; font-weight: 400; margin:0 -1px -1px 0; } */ .sortBtns.mobile-tab a { font-size:15px; } /*.sortBtns.mobile-tab a.active { background: #00939b; color: #fff; border-color:#00939b; position: relative; z-index:1; } */ .sortBtns.mobile-tab::-webkit-scrollbar {display: none; } .sortBtnsCover {position:absolute;left:calc(100% - 50px);top:0;height:100%;display:block;content:'';background-color:#fff;width:50px;background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ } .promotionList ul { display: flex; flex-wrap: wrap; margin:0 -5px; } .promotionList ul li { float:none; flex:0 1 50%; padding:0 5px 12px; } .promotionList ul li a { border-width:1px; } .promotionList ul li a dl { padding:15px; } .promotionList ul li a dl dt small { font-size:12px; margin-bottom: 5px; } .promotionList ul li a dl dt strong { font-size:16px; line-height: 22px; height: 44px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: pre-line; } .promotionList ul li a dl dd { padding-top:20px; font-size:12px; } .modalCard .head { padding:15px; } .modalCard .head .img { width:120px; margin-right:12px; } .modalCard .head .info .kind { padding: 0 6px; height: 16px; line-height: 14px; font-size: 11px; margin: 14px 0 7px; } .modalCard .head .info .name { font-size:22px; } .modalCard .head .btnLink { display:none; right:15px; top:15px; padding:3px 8px; border-radius:5px; font-size:12px; white-space: nowrap; } .modalCard .head .btnLink br { display: none; } .modalCard .body { padding:20px; } .modalCard .body dl dt { font-size:15px; } .modalCard .body dl dd { font-size:13px; } .modalCard .body dl dd .txt { text-indent: -8px; padding-left: 8px; } .modalCard .body .txt1 { font-size:12px; line-height: 1.5; letter-spacing: -0.5px; } .cardModalLink { margin-top:30px; margin-bottom:10px; height: 50px; line-height: 48px; font-size: 15px; border: 1px solid #000; box-sizing: border-box; text-align: center; width:100%; display:block; } .cardModalLink:hover { border:1px solid #00939b; color:#fff; background-color:#00939b; transition:.3s; } .cardList ul { display: flex; margin:0 -8px; flex-wrap: wrap; } .cardList ul li { flex:0 1 50%; padding:0 8px 30px; margin-bottom: 30px; } .cardList ul li a { padding-bottom: 0; } .cardList ul li a .dc { padding-bottom:3px; } .cardList ul li a .dc span { font-size:15px; line-height: 20px; } .cardList ul li a:hover .dc span { color: #000; font-weight: 400; } .cardList ul li a .dc strong { font-size:11px; padding:0 5px; line-height: 17px; height: 18px; border-radius:18px; margin:0 5px 0 0; font-weight: 700; background-color:#fff; } .cardList.attraction-type.course li { flex:0 1 33%; } .cardList.attraction-type.course li a .dc { position: relative; padding-left: 0; } .cardList.attraction-type.course li a .dc strong { position: static; float:none; font-size:11px; padding: 0; border:none; line-height: 17px; height: 18px; font-weight: 700; } .cardList ul li a:hover .dc strong { background: #fff; color:#00939b; } .cardList.attraction-type.course li a span { display: block; margin-top:5px; } .cardList.attraction-type.course ul { max-width:480px; margin: 0 auto; } .cardList.attraction-type.course li { position: relative; z-index:1; padding: 0 8px 30px; } .cardList.attraction-type.course li:nth-child(6n+4) { transform:translateX(200%); } .cardList.attraction-type.course li:nth-child(6n) { transform:translateX(-200%); } .cardList.attraction-type.course li:nth-child(6n+3):after { content: ''; position: absolute; top:50px; left:-35px; border-radius:100%; border:3px dashed #d7d7d7; border-left: 0; border-top:0; border-bottom: 0; width:204px; height: 204px; z-index:-1; } .cardList.attraction-type.course li:nth-child(6n+1):after { content: ''; position: absolute; left: 50px; right:-70%; top:55px; height: 1px; border-top:3px dashed #d7d7d7; z-index:-1; } .cardList.attraction-type.course li:nth-child(6n+2):after { content: ''; position: absolute; left: 50px; right:-70%; top:55px; height: 1px; border-top:3px dashed #d7d7d7; z-index:-1; } .cardList.attraction-type.course li:nth-child(6n):after { content: ''; position: absolute; top: 50px; left: -15px; border-radius: 100%; border: 3px dashed #d7d7d7; border-right: 0; border-top: 0; border-bottom: 0; width: 204px; height: 204px; z-index:-1; } .cardList.attraction-type.course li:nth-child(6n+4):after { content: ''; position: absolute; left: -70%; right:50px; top:55px; height: 1px; border-top:3px dashed #d7d7d7; z-index:-1; } .cardList.attraction-type.course li:nth-child(6n+5):after { content: ''; position: absolute; left: -70%; right:50px; top:55px; height: 1px; border-top:3px dashed #d7d7d7; z-index:-1; } .cardList.attraction-type.course li:last-child:after { display:none; } .cardList.course ul li.three { margin-left:50%; } .cardList.attraction-type.course li a { width:130px; margin: 0 auto; text-align: center; } .cardList.attraction-type.course li a .img { width:110px; height: 110px; border-radius:100%; position: relative; margin:0 auto; z-index:2; } .cardList.attraction-type.course li a .img img { position: absolute; left: 50%; transform: translateX(-50%); top:0; width:auto; height: 110px; } .cardList.attraction-type.course li a .dc { white-space: nowrap; overflow: visible; padding-top: 5px; } .cardList.attraction-type.course li a span span { display: inline; font-size:18px; color: #00939b; margin-right:5px; } .cardList.attraction-type.course li a span span i { vertical-align: middle; position: relative; top:-3px; font-size:16px; } .cardList.attraction-type.course li a .dc span { font-size: 14px; line-height: 18px; } .cardList.attraction-type.course li a .dc > span { padding-right:5px; } .cardList.attraction-type.course li a .dc { padding-top: 3px; } .list-guide-btn { text-align: right; margin-bottom: 15px; } .list-guide-btn a { display: inline-block; vertical-align: middle; height: 30px; line-height: 30px; font-size:12px; border-radius:30px; padding: 0 12px 0 8px; background-color:#f2f2f2; } .list-guide-btn a svg {margin: -4px 1px 0 0;vertical-align: middle;} .caution2 .h4 { font-size:16px; margin-bottom: 21px; } .caution2 .h4 i { font-size:20px; } .caution2 .description3 { padding:15px; font-size:12px; } .caution .h4 { font-size:16px; margin-bottom: 10px; } .caution .h4 i { font-size:20px; } .caution ol { padding:15px; } .caution ol li { padding-left: 20px; font-size:12px; } .modal-body { /* min-height:800px; */ ; min-height: 0 !important} .modalShow .head { padding:15px; } .modalShow.attraction-type .head { padding: 15px; box-sizing:border-box; } .modalShow .head dl dt { font-size:16px; } .modalShow .head dl dd { font-size:12px; } .modalShow .head .loc { padding:3px 8px; border-radius:5px; right:15px; font-size:12px; max-width: 75px} .modalShow .head .loc br { display: none; } .modalShow .body { padding:20px; /* min-height: 700px; */ } .modalShow .body .h4 { font-size:18px; padding-bottom: 10px; } .modalShow .head .h5 { font-size:18px; padding-bottom: 10px; padding: 0; width: calc(100% - 100px); } .seasonPass .modalShow .head .h5 { width:100%; } #yearlyTerms .modalShow .head .h5 { width: 100%; } .modalShow .body .guideMap { margin:0px; height:auto; } .modalShow .body .h4 a { font-size:12px; bottom: 11px;} .modalShow .body .h4 a:after {margin: -2px 0 0 5px} .modalShow .showTime { padding:15px 0 0; } .modalShow .showTime dl dt b { font-size:10px; } .modalShow .showTime dl dt strong { font-size:15px; padding:6px 0; } .modalShow .showTime dl dd { font-size:11px; } .attr-info .desc { font-size:13px; margin-bottom: 15px; } .attr-info table th { font-size:13px; padding: 10px; } .attr-info table td { font-size:13px; } .attr-info ol { padding:10px 0 20px; } .attr-info ol li { font-size:12px; padding-left: 14px; text-indent: -14px; } .showList {margin-top: 40px;} .showList ul {display: flex; flex-wrap: wrap} .showList ul li {width: calc(50% - 15px); margin-bottom:30px;} .showList ul li:nth-child(2n) {margin-left: 30px;} .showList ul li a .img {width: 100%; height: auto; padding-top: 60%; float:none; margin:0 0 15px; border-radius:10px; overflow: hidden; } .showList ul li a .img img {height: 100%; object-position: center; object-fit: cover} .showList ul li a .info { padding-top:0; } .showList ul li a .info dl dt { margin-bottom: 0; } .showList ul li a .info dl dt b { font-size:11px; margin-bottom: 6px; } .showList ul li a .info dl dt strong { font-size: 22px; padding-bottom:3px; } .showList ul li a .xi-plus-thin { display:none; /* width:40px; height: 40px; line-height: 40px; font-size:25px; bottom:-8px; */ } .showList ul li a .info dl dd { display: none; } .showList ul li a .icon { display: none} .showListType2 ul li a .xi-plus-thin { display:none; /* width:40px; height: 40px; line-height: 40px; font-size:25px; bottom:-8px; */ } .todayTimeMobile { display: flex; justify-content: space-between; padding:30px 10px; background: #f9f9f9; align-items: center; margin:0 -15px 20px; position:relative; } /*.menu03 .todayTimeMobile { padding:40px 10px; } */ .todayTimeMobile { padding:40px 10px; } .todayTimeMobile .today { font-size:25px; font-weight: 700; line-height: 1; position: relative; top:2px; text-align:center; max-width: calc(100% - 80px); margin: 0 auto; } /* .menu03 .todayTimeMobile .today { text-align:center; } .menu03 .todayTimeMobile .prev { position:absolute; top:50%; transform:translateY(-50%); z-index:1; } .menu03 .todayTimeMobile .prev:first-of-type { left:10px; } .menu03 .todayTimeMobile .prev:last-of-type { right:10px; } */ .todayTimeMobile .prev { position:absolute; top:50%; transform:translateY(-50%); z-index:1; } .todayTimeMobile .prev:first-of-type { left:10px; } .todayTimeMobile .prev:last-of-type { right:10px; } .todayTimeMobile i { font-size:25px; } .todayTimeMobile .disabled i { opacity:0.5; } .titWant.titWantShow { margin-bottom:20px; margin-top: 70px; } .time-btn { text-align: center; padding-top:20px; } .time-btn .btn-time span { display: inline-block; vertical-align: middle; width:35px; height: 35px; border: 1px solid #000; border-radius:100%; text-align: center; line-height: 33px; font-size:20px; margin:-3px 0 0 5px; } .showListType2 ul li { padding-bottom: 0; margin-bottom: 30px; border: 0; position: relative; } .showListType2 ul li .cir {position: absolute; left: 5px; top:14px; width:15px; height: 15px; background-color: #fff; border-radius: 50%; box-shadow: 2px 2px 5px 2.5px rgba(0,0,0,0.05)} .showListType2 ul li .cir:before {content: "";position: absolute; width: 7px; height: 7px; border-radius: 50% ;left: 50%; top: 50%; transform: translate(-50%,-50%); background-color: #028087} .showListType2 ul li:before { content: ''; position: absolute; left: 12px; top:17px; width:1px; background: #e5e5e5; bottom:-45px; } .showListType2 ul li:last-child:before { display: none; } .showListType2 ul li a .img { display: none; } .showListType2 ul li a .info { padding-top:0; padding-left: 110px; position: relative; } .showListType2 ul li a .info dl { display: flex; flex-wrap:wrap; flex-direction: column-reverse; } .showListType2 ul li a .info dl dt { margin-bottom: 0; } .showListType2 ul li a .info dl dt .time { position: absolute; left: 30px; top:11px; font-size:13px; color: #777777; border: 0; line-height: 25px; font-weight: normal; height:20px; line-height:23px; padding-left:5px; } .showListType2 ul li a .info dl dt .time i { display: none; } .showListType2 ul li a .info dl dt .time.off { border:1px solid #f17c46; color:#f17c46; text-align:center; padding:0 10px; } .showListType2 ul li a .info dl dt strong { font-size:15px; white-space: pre-line; line-height: 1.4; } .showListType2 ul li a .info dl dd { font-size:12px; margin-bottom: 3px; } .showListType2 ul li a .icon , .showListType2 ul li a .info dl dd svg { display: none; } .sub-description { padding:30px 15px; margin-bottom: 40px; } .sub-description dl { display: block; } .sub-description dl dt { font-size:20px; margin-bottom: 10px; } .sub-description dl dd { font-size:13px; line-height: 1.6; } .sub-description .tit1 { font-size:17px; padding-left:0; margin-bottom: 5px; } .sub-description .tit1:before { display: none; } .tel1 p { display: block; margin-right:0; } .program-slider { margin:0 0px 30px; padding-bottom: 25px; position: relative; } .program-slider a { display: block; position: relative; } .program-slider a img { width:100%; vertical-align: top; } .program-slider a .info { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight: 700; position: absolute; left: 0; right:0; bottom:0; padding:15px; font-size:16px; color: #fff; background: rgba(0,0,0,0.6); text-align: right; } .program-slider .swiper-pagination { left: 0; right:0; bottom:0; text-align: center; } .program-slider .swiper-pagination-bullet { background: #c0c0c0; opacity:1; margin:0 4px; transition: all 0.5s ease; } .program-slider .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #00939b; opacity:1; width:25px; border-radius:8px; } .partner-type table { display: block; } .partner-type table thead { display: none; } .partner-type table tbody, .partner-type table tbody tr, .partner-type .tblType td { display: block; border: 0; padding: 0; font-size:13px; text-align: left !important; } .tblArea.partner-type table tbody td { font-size:13px; } .partner-type .tblType tr { padding:15px 15px 15px 110px; border-bottom: 1px solid #d7d7d7; } .partner-type .tblType tr td:first-child { position: absolute; left: 15px; font-weight: 500; } .partner-type .tblType tr td:nth-child(2):before { content: 'T'; display: inline; margin-right:5px; font-weight: 700; color: #00939b; } .partner-type .tblType tr td:nth-child(3):before { content: 'F'; display: inline; margin-right:5px; font-weight: 700; color: #00939b; } .partner-type .tblType tr td:nth-child(4):before { content: 'E'; display: inline; margin-right:5px; font-weight: 700; color: #00939b; } .program-list ul li { padding:20px 0; } .program-list ul li a { padding:0; display: flex; justify-content: space-between; align-items: center; min-height: inherit; } .program-list ul li a .img { position: static; flex: 0 1 150px; margin-right:15px; } .program-list ul li a .info { flex: 1; padding-top:0; } .program-list ul li a .info dl { margin-bottom: 10px; } .program-list ul li a .info dl dt { font-size:16px; margin-bottom: 7px; } .program-list ul li a .info dl dd { font-size:13px; } .program-list ul li a .info .etc div:first-child { font-size:13px; } .program-list ul li a .info .etc div i { font-size:15px; margin-right:0; } .program-list.theme-type ul li { padding:15px 0 30px; border-bottom: 0; } .program-list.theme-type ul li a { display: block; } .program-list.theme-type ul li a .img { margin-right:0; position: relative; width:100%; top:0; } .program-list.theme-type ul li a .img img { width:100%; } .program-list.theme-type ul li a .img span { position: absolute; left:0; right:0; bottom:0; padding:15px; background: rgba(0,0,0,0.6); text-align: right; font-size:14px; color: #fff; } .program-list.theme-type ul li a .info { padding-top:13px; } .program-list.theme-type ul li a .info dl { margin-bottom: 0; } .program-list.theme-type ul li a .info dl dt { display: none; } .program-list.theme-type ul li a .info dl dd { font-size:14px; line-height:1.6; } .greeting .h3 { padding-top:50px; font-size:22px; margin-bottom: 40px; line-height: 1.4; } .greeting .h3:before { height:35px; } .greet-txt1 { margin-bottom: 50px; } .greeting .txt1 { font-size:50px; } .greeting .txt2 { font-size:18px; margin-bottom: 18px; } .greeting .txt3 { font-size:12px; line-height: 1.6; } .greet-txt2 .txt1 { margin-right:20px; } .greet-txt2-box { padding-left: 5%; padding-right:0; margin-bottom: 30px; } .greet-txt3-box .greet-img3 { position: static; margin-bottom: 50px; margin-left: -15px; } .greet-txt3-box .greet-img3 img { width:85%; } .greet-txt3-box { padding: 0; margin-bottom: 50px; } .greet-txt3 { padding-left: 8%; } .greeting .txt1 { margin-left: 20px; } .greet-txt4-box { padding-left: 0; } .greet-txt4-box .greet-img4 img { transform: translateX(0); width:100%; } .greeting .txt1:before { width:8px; height: 8px; right:-12px; } .history .head { padding:50px 0; font-size:20px; margin:0 -15px 60px; } .history .head:before { height: 30px; } .history .head:after { height: 30px; bottom:-30px; } .history ul li { padding-left: 90px; padding-bottom: 20px; margin-bottom: 20px; } .history ul li strong { left: 0; font-size:20px; top:2px; } .history ul li dl { font-size:12px; line-height: 20px; } .history ul li dl dt { width:45px; font-size:15px; } .history ul li dl + dl { margin-top:5px; } .history ul li:before { width:60px; } .character .intro { display: flex; flex-direction: column-reverse; padding-bottom: 50px; margin-bottom: 50px; } .character .intro div { display: block; text-align: center; padding:0 20%; } .character .intro div img { max-width:100%; } .character .intro dl { display: block; width:100%; text-align: center; padding:20px 0 0; } .character .intro dl dt { font-size:20px; margin-bottom: 8px; } .character .intro dl dd { font-size:14px; } .character .etc img { max-width:100%; } .music-list .h5 { font-size:17px; margin-bottom: 12px; } .music-list ul + .h5 { margin-top:40px; } .music-list ul li { padding:25px 60px 25px 0; } .music-list ul li .title { font-size:13px; } .music-list ul li .title i { font-size:15px; margin-top:-2px; } .music-list ul li .btns { right:10px; } .music-list ul li .btns a { width:30px; height: 30px; border-radius:100%; text-indent: -9999px; position: relative; } .music-list ul li .btns a:nth-child(1):before { content: "\ea65"; position: absolute; left: 0; top:0; width:30px; height: 30px; line-height: 28px; text-align: center; font-size:18px; color: #000; font-family:'xeicon'; text-indent: -2px; } .music-list ul li .btns a:nth-child(2):before { content: "\eb7c"; position: absolute; left: 0; top:0; width:30px; height: 30px; line-height: 28px; text-align: center; font-size:18px; color: #000; font-family:'xeicon'; text-indent: -2px; } .marketing { margin-bottom: 20px; } .marketing .head h4 { font-size:23px; margin-bottom: 15px; } .marketing .head div { font-size:15px; } .marketing .head { padding-top:20px; margin-bottom: 70px; } .marketing .list ul { border: 0; } .marketing .list ul li { padding:10px 0; border-bottom: 0; padding-top:10px; margin-top:30px; border-top:1px solid #000; position: relative; overflow: visible; margin-bottom: 55px; } .marketing .list ul li:after { display: block; content: ''; clear: both; } .marketing .list ul li .img { width:120px; height:80px; } .marketing .list ul li .img img { width:100%; height:auto; } .marketing .list ul li .info { padding-top:6px; margin-left: 10px; } .marketing .list ul li .info p { font-size:14px; line-height: 1.3; } .marketing .list ul li .info p + p { margin-top:2px; } .marketing .list ul li .info h5 { position: absolute; left: 0; top:-30px; font-size:18px; } .marketing .list ul li .info h5 span { font-weight: 400; } .marketing .list ul li .info .flex { display: block; } .marketing .list ul li .info .flex div:first-child { margin-bottom: 25px; } .marketing .list ul li .info .flex div:last-child { margin-left: -10px; } .sponser { margin-bottom: 20px; } .sponser .head { margin-bottom: 50px; padding-top:20px; } .sponser .head h4 { font-size:23px; margin-bottom: 15px; } .sponser .head div { font-size:15px; } .sponser .list ul { margin:0 -5px; } .sponser .list ul li { flex-grow: 0;flex-shrink: 1;flex-basis: calc(50% - 10px);margin:0 5px;padding:0 0 40px; } .sponser .list ul li .img img { width:100%; } .sponser .list ul li .item .logo { padding:10px 0 3px; } .sponser .list ul li .item .logo img { height: 25px; } .sponser .list ul li .item .subj { font-size:15px; } .program-desc .text { font-size:15px; line-height: 1.6; } .customer-team { margin-bottom: 40px; padding-top:0; } .customer-team .h5 { font-size:15px; } .customer-team dl { padding:15px; } .customer-team dl dt { font-size:14px; margin-bottom: 7px; } .customer-team dl dd div { font-size:14px; margin:0; display: block; line-height: 1.6; } .program-desc { padding-top:15px; } .program-desc .text2 { font-size:15px; line-height: 1.5; margin-bottom: 20px; } .program-desc .text2 p { font-size:17px; } .ticket-type { margin-bottom: 10px; } .ticket-type > div { margin:0 0 40px; } .ticket-type > div .img img { width:60%; } .ticket-type > div dl dt { font-size:17px; margin-bottom: 6px; } .ticket-type > div dl dd { font-size:14px; } .season-list { padding-top:20px; } .season-list ul { margin:0 -5px; } .season-list ul li { width:50%; padding:0 5px 25px; margin: 0; box-sizing: border-box; } .season-list ul li img { width:100%; } .season-list ul li dl { padding-top:10px; } .season-list ul li dl dt { font-size:15px; margin-right:3px; } .season-list ul li dl dd { font-size:12px; } .calendar { background-position: right 15px center; } .inp-desc { font-size:14px; color: #00939b; padding-top:7px; display: block !important } .search-result .search div .inp-srch { width:240px; height: 40px; font-size:16px; display: inline-block; padding-left: 10px; font-size: 12px; } .search-result .search div .btn-srch { width:40px; height: 40px; font-size:20px; padding:0; } .search-result .search { margin-bottom: 30px; } .search-result .result-hit { font-size:13px; margin-top: -26px; margin-bottom: 10px; } .contentDescription .result-ul li { padding:15px 10px; } .contentDescription .result-ul li .path {display: flex; align-items: center} .contentDescription .result-ul li .path a { font-size:12px; vertical-align:top; } .contentDescription .result-ul li .path a:first-child { font-size:12px; } .contentDescription .result-ul li .path a:after { width:4px; height: 4px; margin-top: -3px} .search-result .btn-board { padding-right:10px; } .search-result .btn-board p { font-size:12px; } .search-result .btn-board em { display: none; } .search-result .result-ul.type2 .btn-board em { display: block; position: static; font-size:11px; padding-top:5px; } .sortBtns.scrollType::-webkit-scrollbar , .guideMapBtns ul::-webkit-scrollbar , .guideWrap.mobile::-webkit-scrollbar , .tabArea ul::-webkit-scrollbar { display:none; } .modalCard .email { font-size:15px; word-break:keep-all; } .modalCard .email.email-sm { font-size:15px; } .modalCard .email small { font-size:12px; padding-top:20px; } .listType10 .ul01 li { float:none; width:auto; } .listType10 dl dd .ul02 .li01 { padding-left:75px; text-indent:-75px; } .listType2 table thead th { font-size:14px; } .listType2 table tbody td { font-size:14px; } .listTypeMovie table thead th { font-size:14px; } .listTypeMovie table tbody td { font-size:14px; } /* 박효진 작업분 반응형 처리 */ .container, .container .containerInner { width:auto; } .inquire .board-head .left { font-size:16px !important; line-height: 1.5; } .inquire .board-head.borderBottom { border-bottom: 2px solid #000; margin-bottom:20px; } .formLayout { display: block; } label.typeBlock, .agreementArea p.typeBlock { font-size:16px; margin-bottom: 10px; margin-top: 25px; } .agreeArea .designCheckbox { margin-top: 28px; } label.typeBlock span, .agreementArea p.typeBlock span { font-size:11px; } .formLayout > li { margin-bottom: 28px; } .select_box .box .select { padding: 16px 30px 17px 10px; width:100%; box-sizing: border-box; font-size:14px; background-image:url('../images/common/bu_select_m.png'); background-size:12px auto; } .select_box .box .select i { right:15px; } .select_box .box .list { top:45px; } .select_box .box .list>li { padding:10px 0 10px 10px; font-size:14px; } input[type="text"], input[type="password"], input[type="tel"], input[type="number"], input[type="email"], .filebox label, textarea { padding:14px 13px; -webkit-appearance:none; border-radius:0; font-size:14px; width:100%; box-sizing: border-box; } .hp-box.type2 { padding-right:0; } .formLayout > li.customFileStyle > div { display: block; } .formLayout > li.customFileStyle .customDesign { width:auto; padding:16px 20px; font-size:14px; margin-bottom: 10px; } .formLayout > li.customFileStyle .fakeInput { width:auto; padding:15px; font-size:13px; margin-left: 0; padding-bottom: 5px; } .formLayout > li.customFileStyle .fakeInput span { margin:1px 10px 0px; display: inline-block; vertical-align: top; } .formLayout > li.customFileStyle .fakeInput span i { transform: translateY(4px); } .formLayout input { } .inquire .agreementArea { margin-bottom: 30px; } .inquire .agreementArea .agreeTit { margin-bottom: 12px; } .inquire .agreementArea .agreeBox { padding:12px 15px!important; font-size:14px !important; line-height: 1.8 !important; height: 100px !important; } .agreeArea .designCheckbox { font-size:14px; } .agreeArea .designCheckbox .checkbox { } .agreeArea input[type="checkbox"]:checked + div .checkbox { } .inquire .agreementArea .agreeTit .agreeArea { white-space: nowrap; } label.long { display: block; position: relative; padding-left: 24px; } .inputArea .mb70 label.long { padding-left:0; } label.long span { font-size:13px; } label.long span.checkbox { font-size:19px; } input.checkbox + em { width:18px; height: 18px; position: absolute; left: 0; top:0; background-size:18px auto !important; } input.checkbox + em + span { font-size:14px; } .inquire .btnArea { margin-top:30px; } .inquire .grayBox h3 { font-size:20px; width:auto; margin-bottom:15px; } .inquire .grayBox .subDesc, .reservation .grayBox .subDesc { width:auto; font-size:14px; line-height:1.5; } .inquire .grayBox .subDesc li { padding-left:20px; text-indent:-20px; } .inquire .grayBox .subDesc li + li { margin-top:6px; } .pageNation { margin-top:30px; } .pageNation .paging li { margin:0 4px; } .pageNation .paging li a, .pageNation .paging li.current a { font-size:15px; width: 15px; } .pageNation .prev, .pageNation .next { font-size:15px; } .formLayout > li.phoneNumStyle .widthSize { width:auto; } .formLayout > li.phoneNumStyle .widthSize div span { padding:0; font-size:20px; flex:0 0 30px; text-align:center; } .lostArticle .inputArea { padding:20px 0 10px 0; } .formLayout > li { margin-bottom:10px; } .formLayout > li.hidden { display:none; } .lostArticle .grayBox .desc { display:block; } .lostArticle .grayBox .desc p { font-size:14px; line-height:1.5; } .lostArticle .grayBox .btnType { display: block; margin: 25px auto 0; width: 50%; border-radius: 0; box-sizing: border-box; height: 50px; line-height: 48px; padding: 0; text-align: center; font-size: 15px; } .lostArticle .grayBox .btnType span { font-size:14px; } /* 예약 APP */ .container.reservation .contentsInner { width:auto; } .container.reservation .containerInner .inner { padding:0; } .container.reservation .contentsInner { padding-bottom:50px; position:relative; } .container.reservation .inner .imgApp { top:inherit; bottom:-130px; } .container.reservation .inner .imgApp img { width:180px; } .container.reservation .contentsInner .topSection .titleArea { padding-top:50px; } .container.reservation .contentsInner .topSection .titleArea span { line-height:1.6; font-size:15px; } .container.reservation .contentsInner .topSection .titleArea h3 { font-size:30px; margin-top:20px; } .container.reservation .contentsInner .topSection .titleArea h3 span { height:30px; line-height:35px; font-size:30px; } .container.reservation .contentsInner .topSection .subDesc01 { margin:40px 15px 30px; } .container.reservation .contentsInner .topSection .subDesc01 li { height:auto; margin-top:8px; font-size:15px; line-height:25px; } .container.reservation .contentsInner .topSection .subDesc01 li span { padding-left:3px; background-size:auto 25px; } .appMarkWrap { width: 60px;height: 60px; } .appMark { width:25px; } .container.reservation .contentsInner .topSection .subDesc02 ul { margin-top: 40px; padding:0 15px 100px; justify-content: space-between; } .container.reservation .contentsInner .topSection .subDesc02 li { width:60px; padding-top:65px; margin:0 !important; font-size:13px; line-height:1.6; background-size:60px auto !important; } .container.reservation .contentsInner .bottomSection .appStepArea h4 { font-size:20px; } .container.reservation .contentsInner .bottomSection .appStepArea ul { margin-top:30px; flex-wrap:wrap; margin-bottom:40px; } .container.reservation .contentsInner .bottomSection .appStepArea li { flex: 0 0 50%; margin-bottom:30px; padding-top:150px !important;; background-size:auto 140px !important; text-align:center; } .container.reservation .contentsInner .bottomSection .appStepArea li strong { font-size:15px; } .container.reservation .contentsInner .bottomSection .appStepArea li p { font-size:13px; line-height:1.5; } .container.reservation .contentsInner .bottomSection .appDownArea { padding:20px; } .container.reservation .contentsInner .bottomSection .appDownArea p { font-size:15px; line-height:1.6; position: relative; z-index: 1; } .container.reservation .contentsInner .bottomSection .appDownArea p span { font-size:15px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea { padding:20px 0 0; } .container.reservation .contentsInner .bottomSection .appDownArea img { right:0; bottom:50px; width:100px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a { width: 140px; padding: 10px 0; margin-right: 6px; margin-bottom: 7px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a span { font-size:14px; } .container.reservation .contentsInner .bottomSection .appDownArea .appBtnArea a i { font-size:16px; } .reservation .grayBox { margin:20px 15px 0; } .reservation .grayBox .subDesc ul li { padding-left:20px; text-indent:-20px; font-size: 13px; line-height: 1.7; } .lostArticle .modal-container { padding: 24px 10px; } .lostArticle .modal-container .tit { font-size:15px; margin-bottom:10px; } .lostArticle .modal-container .grayBox { margin-bottom:0; background:#f9f9f9; } .lostArticle .modal-container .grayBox ol { padding:0; display:flex; justify-content: space-between; } .lostArticle .modal-container .grayBox li { margin:0; float:none; flex: 1; padding-top:45px; background-repeat:no-repeat; background-position:50% 0; background-size:auto 40px; } .lostArticle .modal-container .grayBox li:nth-child(1) { background-image:url(../images/customer_service/ico_loss1.svg); } .lostArticle .modal-container .grayBox li:nth-child(2) { background-image:url(../images/customer_service/ico_loss2.svg); } .lostArticle .modal-container .grayBox li:nth-child(3) { background-image:url(../images/customer_service/ico_loss3.svg); } .lostArticle .modal-container .grayBoxBg02 li:nth-child(1) { background-image:url(../images/customer_service/ico_loss4.svg); } .lostArticle .modal-container .grayBoxBg02 li:nth-child(2) { background-image:url(../images/customer_service/ico_loss5.svg); } .lostArticle .modal-container .grayBoxBg02 li:nth-child(3) { background-image:url(../images/customer_service/ico_loss6.svg); } .lostArticle .modal-container .grayBoxBg02 li:nth-child(4) { background-image:url(../images/customer_service/ico_loss7.svg); } .lostArticle .modal-container .grayBoxBg02 { height:auto; padding-bottom:0; } .lostArticle .modal-container .grayBoxBg02 ol { padding-top:23px; display:flex; flex-wrap:wrap; } .lostArticle .modal-container .grayBoxBg02 li { position:static; flex:0 1 50%; margin-bottom:25px; } .lostArticle .modal-container .grayBox em { font-size:12px; } .lostArticle .modal-container .grayBox p { font-size:13px; padding-top:4px; } .lostArticle .modal-container .grayBox + .tit { margin-top:24px; } .seasonPass .tblArea .tblType th, .seasonPass .tblArea .tblType td { padding:10px 0; letter-spacing:-0.5px; line-height:1.4; } .seasonPass .tblArea .tblType td { padding-top:15px; padding-bottom:15px; } .tblArea .descNotice { font-size:13px; line-height:1.7; margin:15px 0; } .seasonPass .stepArea ol { flex-wrap:wrap; } .seasonPass .stepArea ol li { flex:0 1 50%; margin-bottom:25px; } .seasonPass .stepArea span { padding-bottom: 25px; padding-top:10px; font-size:13px; } .seasonPass .stepArea strong { font-size:15px; } .seasonPass .stepArea p { margin-top:8px; font-size:14px; line-height:1.5; } .seasonPass .stepArea li i { font-size:35px; } .seasonPass .stepArea li i.xi-arrow-right { display:none; } /*.seasonPass .stepArea li:nth-child(1) { background-image:url(../images/season_pass/step01_m.png); background-size:auto 35px; background-position:0 40px; } .seasonPass .stepArea li:nth-child(2) { background-image:url(../images/season_pass/step02_m.png); background-size:auto 40px; background-position:0 40px; } .seasonPass .stepArea li:nth-child(3) { background-image:url(../images/season_pass/step03_m.png); background-size:auto 35px; background-position:0 40px; } .seasonPass .stepArea li:nth-child(4) { background-image:url(../images/season_pass/step04_m.png); background-size:auto 35px; background-position:0 40px; } */ .seasonPass .promotionList ul { margin:0 -5px; } .seasonPass .promotionList ul li { /*flex:0 1 50%; */ padding:0 5px 15px; } .seasonPass .promotionList ul li a { } .seasonPass .promotionList ul li a dl { padding:10px 10px 20px; } .seasonPass .promotionList ul li a dl dt strong { font-size:15px; height:auto; line-height:1.5; } .seasonPass .promotionList ul li a dl dd { font-size:13px; line-height:1.4; } .attr-info .desc { margin-bottom:6px; } .seasonPass .modal .bottom-btns { margin:20px 0 0; } .seasonPass .modal .showSlider .swiper-slide { width:100%; height:auto; } .seasonPass .modal .showSlider .swiper-slide img { width:100%; } .seasonPass .contentDescription { margin-top:50px; } .contentDescription .swiper-pagination-bullet { background:#c0c0c0; transition:all 0.3s ease; margin:0 3px; } .contentDescription .swiper-pagination-bullet-active { background:#00939b; } .promotionList.mobile { padding-bottom:40px; position:relative; margin:0 -5px; } .promotionList.mobile > .swiper-wrapper { flex-direction:row; } .price-other1 .tblArea:first-child { border-top-width:2px; } .price-other1 .tblArea .tblType.both tr:last-child td { border-bottom:0; } .price-other1 .tblArea .tblType.both tr:last-child th { border-bottom:0; } .price-other1 .tblArea .tblType.both tr th[rowspan] { border-bottom:0; } .grayBox.grayBox-mb {padding: 30px 15px !important; } .grayBox-np {padding:0 !important; } .sub-description.sub-description-mt {margin-top:30px; } .sub-description.sub-description-tpr {padding: 45px 35px 45px 35px; } .date-box > div > i {right: 10px;font-size: 18px; } .groupBox {text-align:center; } .groupImg {float:none;margin-right:0;margin-bottom:20px;width: 35%; } .groupTxt {float:none;width:100%; } .groupTxt h3 {font-size: 22px;margin-bottom: 20px; } .groupTxt h4 {font-size: 16px; } .groupTxt p {font-size: 12px; } .bcBannerTxt {left:5vw; } .chargedDesc {font-size:12px; } #modalEmail h5 { font-size: 16px; line-height:1.2; } #modalPrivacy .modalTabBtn span { font-size: 16px; line-height:1.2; } #modalPrivacy .modal-header { padding:0 0 0 15px; } .seasonPass .promotionList ul li a dl dd {padding-top:5px;font-size:12px; line-height: 1.4; } .showMsg { background: #00939b; border-radius:10px; margin-top:0px; margin-bottom: 20px; position: relative; font-size:13px; line-height: 1.5; color: #fff; word-break: keep-all; } .showMsg > div { padding:15px; } .showMsg i { position: absolute; left: 15px; top:17px; font-size:18px; } .showMsg p { padding-left: 22px; } .promotionList .swiper-slide a {height: 260px; } .sub_top_btn.hold { position: absolute } } @media(max-width:768px) { #TodayTime { width:100%; z-index:100; } .todayTime { padding: 30px 20px; } .todayTime .labels .labelNight { height:23px; line-height:20px; font-size:12px; } .todayTime .labels .labelNight i { font-size:14px; } .todayTime .labels .labelNormal { height:20px; line-height:16px; font-size:12px; } .todayTime .labels .labelNormal i { font-size:14px; } .is-sticky .todayTime { margin-right:0; } .todayTime .labels { margin-bottom:10px; } .todayTime .today { font-size:25px; } .todayTime .times { margin-top:30px; } .todayTime .times div strong { width:35px; height: 45px; font-size:22px; line-height: 50px; margin:0 3px; } .todayTime .times span { display: block; font-size:25px; line-height: 30px; font-weight:500; text-align: center; margin:3px auto -2px; } .todayTime .times div + div:before { top:21px; width:4px; height: 4px; } .todayTime .times div + div:after { top:33px; width:4px; height: 4px; } .is-sticky .todayTime { margin:0; } .is-sticky #TodayTime { left:0; right:0; background:#fff; } #TodayTime .mobile .times-list { padding:0; } #TodayTime .swiper-container { height:222px; } #TodayTime .swiper-container .swiper-slide { height:56px; } #TodayTime .times-list { border-bottom:1px solid #d7d7d7; } .is-sticky #TodayTime .mobile .times-list { margin:0; padding:0; } .mainCalenda.mainCalendaTime .calendaTop > strong { font-size: 23px; } .calendarBtnLeft { margin-right: 20px; } .calendarBtnRight { margin-left: 20px; } .mainCalenda.mainCalendaTime .calendaDay { height: 50px; } .mainCalenda.mainCalendaTime .calendaDay strong { line-height: 50px; font-size:12px; } .titWant.titWantAll { margin: 30px 0 20px; display:block; font-size:16px; } .times-list { border-top:2px solid #000; padding:0 10px; margin:0 -15px 30px; } .times-list .swiper-slide dl { border-bottom: 1px solid #d7d7d7; padding:20px 0; } .times-list .swiper-slide:last-child dl { border-bottom:0; } .times-list .swiper-slide dl:after { display: block; content: ''; clear: both; } .times-list .swiper-slide dl { position: relative; } .times-list .swiper-slide dl dt { float:left; width:100px; font-size:15px; color: #777; margin-left: 5px; } .times-list .swiper-slide dl dd { float:left; width:80px; font-size:15px; color: #777; } .times-list .swiper-slide dl dd strong { position: absolute; right:10px; top:50%; transform:translateY(-50%); font-size:17px; color: #000; font-weight: 500; white-space:nowrap; } .time-btn .btn-time { display: inline-block; vertical-align: middle; font-size:17px; color: #000; } .titWant.titWantShow { margin-bottom:20px; margin-top: 20px; font-size:18px; } .swiperCalender .slider { padding: 20px 30px; } .swiperCalender .slider .swiper-button-prev { left:-10px; } .swiperCalender .slider .swiper-button-next { right:-10px; } .swiperCalender .slider .swiper-slide a .date { font-size:18px; } .guideMapMark { padding: 10px 0px 10px 20px; width: 193px} .guideMapMark li { min-width: 60px} .seasonPass .grayBox h3 { font-size:20px; line-height:1.4; } .seasonPass .grayBox p { font-size:14px; line-height:1.6; } .swiperCalender .slider .swiper-button-next, .swiperCalender .slider .swiper-button-prev { font-size: 30px; } /*.cardList.course ul li:nth-child(odd):before { content: ''; position: absolute; left: 50px; right:-70%; top:55px; height: 1px; border-top:2px dashed #d7d7d7; } */ /*.cardList.course ul li.nth3:nth-child(odd):before { left:-70%; right:50px; } */ .cardList.attraction-type.course ul { max-width:350px; margin: 0 auto; } .cardList.attraction-type.course li { flex: 0 1 50%; } .cardList.attraction-type.course li:nth-child(6n+4) { transform:translateX(0); } .cardList.attraction-type.course li:nth-child(6n) { transform:translateX(0); } .cardList.attraction-type.course li:nth-child(4n+3) { transform:translateX(100%); } .cardList.attraction-type.course li:nth-child(4n+4) { transform:translateX(-100%); } .cardList.attraction-type.course li:nth-child(4n+2):after { content: ''; position: absolute; top: 50px; left: -35px; border-radius: 100%; border: 3px dashed #d7d7d7; border-left: 0; border-top: 3px dashed transparent; border-bottom: 3px dashed transparent; width: 200px; height: 260px; z-index: -1; } .cardList.attraction-type.course li:nth-child(4n+3):after { content: ''; position: absolute; left: -70%; right: 50px; top: 65px; height: 1px; border-top: 3px dashed #d7d7d7; z-index:-1; } .cardList.attraction-type.course li:nth-child(4n+4):after { content: ''; position: absolute; top: 50px; left: 0; border-radius: 100%; border: 3px dashed #d7d7d7; border-right: 0; border-top: 3px dashed transparent; border-bottom: 3px dashed transparent; width: 200px; height: 260px; z-index:-1; } .cardList.attraction-type.course li:nth-child(4n+1):after { content: ''; position: absolute; left: 50px; right: -70%; top: 65px; height: 1px; border-top: 3px dashed #d7d7d7; z-index:-1; } .cardList.attraction-type.course li:last-child:after { display:none; } .attractionKids { width:30px; height:30px; right:10px; line-height:30px; font-size:10px; } .guideMapName {height: 30px;font-size: 12px;line-height: 30px;padding: 0 10px 0 10px;transform: translateY(8px); } .guideMapName::after {position: absolute;content: '';display: block;left: 50%;transform: translateX(-5px);bottom: -20px;width: 10px;height: 20px;border-top: 10px solid #00939b;border-left: 5px solid transparent;border-right: 5px solid transparent;border-bottom: 10px solid transparent;box-sizing: border-box; } .guideMapSize { display: flex; } .guideMapSize button {width: 40px;height: 40px;display: flex;justify-content: center;align-items: center; } .guideMapSize button:nth-child(1) {margin-right: -1px; } .guideMapSize button svg {font-size: 15px;} .guideMapMark li::after { width: 10px;height: 10px; } .guideTabs a:before {width: 50px;height: 50px;background-size: 25px 25px; } .guideTabs a p {font-size: 10px; padding: 7px 0 0px; } .btnLink1 {font-size:13px;font-weight:500;text-decoration:underline; } .btnLink1:after {display:none; } .promotionList ul li a div { margin: 15px auto 0; } .cardList.cardList-r ul li {padding: 0 10px; } .nodata {text-align: center; margin: 70px 0; } .modalShow .body .guideMap {margin:0 0 0 -30px; width: calc(100% + 50px);/*height:auto; */ height: calc(39.52vw + 19.76px); } .modalShow .body .h4 {padding-top: 30px; } .showList ul li a .info dl dt strong { display:block;width:calc(100% - 50px); } .cardList.attraction-type.attraction-desc ul li:nth-child(3n-2) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.attraction-desc ul li:nth-child(3n-1) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.attraction-desc ul li:nth-child(3n) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.attraction-desc ul li:nth-child(2n-1) {margin-right: 20px;margin-left: 0px; } .cardList.attraction-type.attraction-desc ul li {flex-grow: 0;flex-shrink: 1;flex-basis: calc(50% - 10px); margin-bottom: 35px; } .cardList.attraction-type.attraction-desc ul li a .img {margin-bottom: 5px; } .cardList.attraction-type.attraction-maintain ul li a .img {margin-bottom: 5px; } .lostArticle .modal-container .grayBox.grayBoxBg01 { padding:50px 0 40px 0 !important; } .cardList.attraction-type.attraction-maintain ul li:nth-child(3n-2) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.attraction-maintain ul li:nth-child(3n-1) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.attraction-maintain ul li:nth-child(3n) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.attraction-maintain ul li:nth-child(2n-1) {margin-right: 20px;margin-left: 0px; } .cardList.attraction-type.attraction-maintain ul li {flex-grow: 0;flex-shrink: 1;flex-basis: calc(50% - 10px); margin-bottom: 35px; } .cardList ul li a .dc strong {float:none;border:none;padding:0; } .cardList.attraction-type.course ul li a .dc strong {float:none;/*border:1px solid #00939b; */ padding:0;line-height: 17px;height: 18px;font-weight: 700; } .cardList.attraction-type.course li {padding: 0 0px 40px; } .cardList.attraction-type.course li .course-cover i {font-size:30px; } .cardList.attraction-type.course li a .img { width: 130px;height: 130px; } .cardList.attraction-type.course li a .img img {height: 130px; } .cardList.attraction-type.course li a .dc { padding-top: 3px; } .cardList.attraction-type.course {margin-top: 30px; } .cardList.attraction-type.course ul li a .dc {white-space: normal; } .cardList.attraction-type.course li a .dc span {font-size: 15px;} .cardList.attraction-type.course ul li a span {margin-top: 5px; } .cardList.attraction-type.course li a span span i {font-size: 16px; margin-right:0px; } .cardList.attraction-type.course li a span span {margin-right:0px; } .cardList.attraction-type.shopping {margin-top:20px; } .cardList.attraction-type.shopping ul li:nth-child(3n-2) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.shopping ul li:nth-child(3n-1) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.shopping ul li:nth-child(3n) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.shopping ul li:nth-child(2n-1) {margin-right: 20px;margin-left: 0px; } .cardList.attraction-type.shopping ul li {flex-grow: 0;flex-shrink: 1;flex-basis: calc(50% - 10px); margin-bottom: 35px; } .cardList.attraction-type.shopping ul li a .img {margin-bottom: 5px; } .cardList.attraction-type.facility {margin-top:20px; } .cardList.attraction-type.facility ul li:nth-child(3n-2) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.facility ul li:nth-child(3n-1) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.facility ul li:nth-child(3n) {margin-right: 0px;margin-left: 0px; } .cardList.attraction-type.facility ul li:nth-child(2n-1) {margin-right: 20px;margin-left: 0px; } .cardList.attraction-type.facility ul li {flex-grow: 0;flex-shrink: 1;flex-basis: calc(50% - 10px); margin-bottom: 35px; } .cardList.attraction-type.facility ul li a .img {margin-bottom:5px; } .grayBoxNone {background-color:transparent; } .inquire .grayBox h3 {margin-top: 15px;margin-bottom: 25px; } .formLayout > li.customFileStyle > div {display: flex; } .formLayout > li.customFileStyle .customDesign {width: 20%;height:46px;line-height: 46px;margin-bottom: 0;padding:0;text-align:center;font-size:11px; } .formLayout > li.customFileStyle .fakeInput {width: calc(80% - 20px);margin-left:20px;height:46px;padding: 9px; } .formLayout input {font-size:11px; } .textAreaStyle textarea {font-size:11px; } .select_box .box .select {font-size:11px;white-space:nowrap; } .formLayout > li.emailStyle > div > span {font-size: 16px; } .formLayout > li.customFileStyle .fakeInput span {margin: 1px 0px 0px;max-width:100%; } .formLayout > li.customFileStyle .fakeInput > span > span {max-width: calc(100% - 40px); } label.typeBlock, .agreementArea p.typeBlock {font-size: 14px; } .inquire .agreementArea .agreeBox { font-size:12px !important; } .grayBox-full {width:calc(100vw - 40px);margin-left:-20px;padding:30px 20px 30px !important; } .container.reservation .contentsInner .topSection {padding-top: 0px; } .container.reservation .contentsInner .bottomSection {margin-top: 60px; } .inner-attr {overflow:hidden; } .attr-info { line-height: 23px;font-size: 12px; } .tabArea.tabArea-p40 ul li a {padding: 0 40px; } .seasonPass .grayBox.seoulland strong { font-size: 25px; margin-bottom: 30px; } .seasonPass .grayBox.dulmoa strong { font-size: 25px; margin-bottom: 30px; } .seasonPass .grayBox.damoa strong { font-size: 25px; margin-bottom: 30px; } .character {margin: 70px auto 0; } .bcBannerTxt p {font-size:12px; } .bcBannerTxt strong {font-size:25px; } .groupImg {width: 62%; } .groupTxt {text-align:left; } .promotionList .swiper-slide a {height: 230px; } .sub_top_btn { width: 50px; height: 50px; font-size: 10px } .sub_top_btn svg { font-size: 16px } .todayTime .labels .labelNight svg {font-size: 14px;} .showList ul li {width: calc(50% - 10px); } .showList ul li:nth-child(2n) {margin-left: 20px;} .showList ul li a .img {border-radius: 0px} .showList ul li a .info dl dt strong {display: block;width: 100%;font-size: 16px;} } @media(max-width:400px) { .next-line-1200-400 { display:inline; } .bcBannerTxt p {font-size:10px;margin-bottom: 10px; } .bcBannerTxt strong {font-size:20px; } } @media(max-width:325px) { .search-result .search div .inp-srch { width:190px; } } @media(max-width:310px) { .cardList.attraction-type.course li a {width: 110px; } .cardList.attraction-type.course li a .img {width: 110px;height: 110px; } .cardList.attraction-type.course li:nth-child(4n+2):after { left: -64px; } .cardList.attraction-type.course li:nth-child(4n+1):after {left: 20px; } } /*영문 css*/