.top_main{ margin-top: 3rem; } .top_main .top_list{ padding-bottom: 2.4rem; } .top_main .list_tit{ font-size: 3.0rem; font-weight: bold; display: block; margin-bottom: 1.3rem; } .top_list .headline_title{ margin-top: 1.9rem; font-size: 2.4rem; line-height: 3.0rem; margin-bottom: 1.5rem; } .top_list .desc{ -webkit-line-clamp: 5;} .top_list .curr_day{ margin-top: 1.5rem; display: block; } .con_list .con_item a{gap: 1.5rem;} .con_list .con_item+.con_item{margin-top: 2.5rem;} .con_list .img_box{ width: 10.5rem; height: 7.6rem; } .list_bott{margin-top: 2.4rem;} .paging .pag_btn{ display: block; width: 4rem; height: 4rem; border: 1px solid #dfdfdf; } .paging .pag_btn::before{ content: ''; display: block; background: url(../img/icon/paging_arrow.png) 50% 50% no-repeat; line-height: 0.4rem; width: 4rem; height: 4rem; } .paging .paging_prev{ transform: rotate(-180deg); } .paging ul{ display: flex; align-items: center; justify-content: center; position: relative; gap: 0.3rem; } .paging .paging_page{ border: 1px solid #dfdfdf; width: 4rem; height: 4rem; } .paging .paging_page.on{ background: #1ea9a6; border: 1px solid #1ea9a6; } .paging .paging_page.on a{color: #fff;} .paging .paging_page+.paging_page{border-left: 0;} .paging{display: block; width: 100%;margin-top: 2.5rem;} .paging ul{display: flex; justify-content: center;} .paging ul li{width: 4rem; height: 4rem; border: 1px solid #dfdfdf; box-sizing: border-box;} .paging ul li a{display: block; width: 100%; height: 100%; font-size: 1.5rem; line-height: 3.8rem; text-align: center;} .paging ul li.on{background: #005bac; border:none;} .paging ul li.on a{color:#fff;} .paging ul li.prev{margin-right: 1rem; border-left: 1px solid #dfdfdf;position: absolute; left: 0; top: 0;} .paging ul li.next{margin-left: 1rem; border-left: 1px solid #dfdfdf;position: absolute; right: 0; top: 0;} .paging ul li.prev a{background: url(../img/icon/ic_paging_arrow.png) 50% 50% no-repeat; transform: rotate(-180deg);background-size: 100%;} .paging ul li.next a{ background: url(../img/icon/ic_paging_arrow.png) 50% 50% no-repeat; background-size: 100%; margin: 0 auto; } .search_list_top .period .title { display:block; font-size:22px; font-weight:500; margin-bottom: 1.5rem;} .search_list_top .period ul { display:flex; margin-top:1.5rem; } .search_list_top .period ul li { flex: 1;height:4.0rem; box-sizing:border-box; border:1px solid #ccc; } .search_list_top .period ul li + li { border-left:0; } .search_list_top .period ul li span { display:block; width:100%; height:100%; line-height:40px; font-size:1.5rem; font-weight:500; text-align:center; cursor:pointer; } .search_list_top .period ul li.on { background:#333; border-color:#333; } .search_list_top .period ul li.on span { color:#fff; } .search_list_top .period .date_select { display:flex; margin-top: 1.5rem; } .search_list_top .period .date_select .form_text { width:46%; background: #f4f4f4; height: 4rem; border:1px solid #ccc; } .search_list_top .period .date_select .form_text input { width:100%; height:100%; font-size:1.5rem; background:transparent; padding:0 1.5rem; border:0; box-sizing:border-box; text-align: center;} .search_list_top .period .date_select span { width:8%; height:4.5rem; line-height:4.5rem; text-align:center; } .search_list_top .grid{margin-top: 4rem;} .search_list_top .grid ul{ display: grid; grid-template-columns: repeat(3, 1fr); row-gap: 1.4rem; } .search_list_top .grid ul li{width: 100%;} .search_list_top .grid ul li:nth-child(4){border-left: 1px solid #ccc} .search_list_top .period ul li #directly{letter-spacing: -0.9px;} .search_list_top .search_input{margin-top: 3.5rem;} .search_list_top .search_input input{ width: 100%; height: 4rem; border: 1px solid #ccc; padding: 0; box-sizing: border-box; font-size: 1.5rem; letter-spacing: -0.05em; padding: 0 1.5rem; } .search_list_top .sch_button{ height: 4.5rem; width: 100%; display: block; background: #005bac; color: #fff; margin-top: 4rem; } .sc_result{margin-top: 7rem;} .sc_result .result_count{ font-size: 2.5rem; display: block; padding-bottom: 2.1rem; } .sc_result .result_count span{color: #005bac;} .no_data { text-align:center; margin-bottom: 10rem; padding-top: 4rem; font-size: 2rem; line-height: 2.5rem; border-top: 1px solid #000;} .no_data strong {font-size:2.5rem; line-height:3.2rem; font-weight:500; display: block;} .no_data span strong { font-weight:600; } .no_data p { display:block; font-size:1.4rem; line-height:2rem; font-weight:400; color:#666; margin-top:4rem; } .ui-datepicker{width: calc(100% - 3rem); box-sizing: border-box; box-shadow: 0px 10px 20px 0px rgb(0 0 0 / 20%); border-radius: 0;} .ui-widget-content{ left: 1.5rem !important; margin-top: 6px; padding: 0; border: 1px solid #ccc; border-top: 4px solid #005bac; background: #fff; z-index: 99 !important;} .ui-widget-header{padding: 0; border-radius: 0; background: #fff;} .ui-datepicker-title{text-align: center;} .ui-datepicker .ui-datepicker-header{padding: 0; margin-top: 4.5rem; margin-bottom: 2.5rem; border: none;position: relative;} .ui-datepicker-year, .ui-datepicker-month{font-size: 2.5rem; font-weight: 500;} .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{position: absolute; width: 2rem; height: 2rem; top: 0.5rem; cursor: pointer;} .ui-datepicker .ui-datepicker-prev{left: 8rem;} .ui-datepicker .ui-datepicker-next{right: 8rem;} .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{display: block; left: 0; top: 0; margin: 0; width: 100%; height: 100%; font-size: 0;} .ui-datepicker .ui-datepicker-prev span{background: url(../img/icon/title_arrow.png) 50% 50% no-repeat; background-size: 1rem; transform: rotate(-180deg);} .ui-datepicker .ui-datepicker-next span{background: url(../img/icon/title_arrow.png) 50% 50% no-repeat; background-size: 1rem;} .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: none; background: #fff;} .ui-datepicker table{margin: 0 auto 3rem auto; width: calc(100% - 4rem); border-top: 1px solid #000; font-size: 1.6rem;} .ui-datepicker th{padding: 1rem 0 0; height: 4rem; font-weight: 500;} .ui-datepicker td{padding: 0; height: 4rem;} .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{display: block; padding: 0; width: 100%; height: 100%; border: none; line-height: 4rem; background: #fff;} .ui-datepicker-current-day .ui-state-active{background: #000; color:#fff;} .ui-datepicker td span, .ui-datepicker td a{text-align: center;} .ui-datepicker .ui-datepicker-buttonpane{position: absolute; left: auto !important; right: 2rem; top: 2.5rem; margin: 0; padding: 0; width: 2rem; height: 2rem; border: none;} .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{display: none;} .ui-datepicker .ui-datepicker-buttonpane button{margin: 0; padding: 0; width: 100%; height: 100%; background: url(../img/icon/calendar_close.png) 50% 50% no-repeat; background-size: 2rem;} .sc_Most_v{margin-top: 4rem;} .sc_Most_v .con_list .con_item:first-child{margin-top: 0;} .m_art_ad_02 { margin: 40px 0; } .m_art_ad_02 .ad_box { width: 100%; margin: 0 auto; text-align: center; height: 100%; } .m_art_ad_02 .ad_box a{ display: block; width: 100%; height: 15rem; } .m_art_ad_02 .ad_box img{ width: 100%; height: 100%; } .event_banner{ margin-top: 20px; } .event_banner img{ width: 100%; height: 100%; }