@charset "utf-8"; /* 서브페이지 */ #subBody { position: relative; width: 100%} #subBody .subVisual { width: 100%; height: 400px; position: relative; background: url('../../images/sub/subvisual_1.jpg') no-repeat center center} #subBody .subVisual.type2 { background: url('../../images/sub/visual_2.jpg') no-repeat center center; } #subBody .subVisual.type3 { background: url('../../images/sub/visual_3.jpg') no-repeat center center; } #subBody .subVisual.type4 { background: url('../../images/sub/visual_4.jpg') no-repeat center center; } #subBody .subVisual.type5 { background: url('../../images/sub/visual_5.jpg') no-repeat center center; } #subBody .subVisual .visualTxt { max-width: 1400px; margin: 0 auto; padding-top: 192px; text-align: center; } #subBody .subVisual .visualTxt p { color: #fff; font-size: 16px; word-break: keep-all} #subBody .subVisual .visualTxt p.img { margin-bottom: 40px; font-size: 45px; font-weight: 600; } #subBody .subVisual .visualTxt p.img img { height: 100%} #subBody .location { box-sizing: border-box; width: 100%; height: 62px; border-top: 1px solid rgba(255, 255, 255, 0.4); /* padding:0 40px; */ z-index: 100; position: absolute; top: 328px; left: 0; } #subBody .location>.inner { max-width: 1400px; padding: 0px; } #subBody .location .home { display: block; float: left; width: 62px; height: 61px; border-left: 1px solid rgba(255, 255, 255, 0.4); border-right: 1px solid rgba(255, 255, 255, 0.4); background: url("../../images/sub/home_link.png") no-repeat center center; } #subBody .location .oneD { position: relative; float: left; height: 61px; border-right: 1px solid rgba(255, 255, 255, 0.4); width: 270px; } #subBody .location .oneD>a { display: block; box-sizing: border-box; height: 61px; padding: 23px 30px; font-size: 16px; color: #fff; width: 270px; } #subBody .location .oneD>a span { background: url("../../images/sub/location_arrow.png") no-repeat right center; display: block; } #subBody .location .oneD>a.current { color: #00448d; } #subBody .location .oneD .twoD { display: none; position: absolute; top: 61px; left: -1px; padding: 20px 0 25px; width: 100%; border: 1px solid #d9d9d9; border-top: 0; background: #fff; } #subBody .location .oneD .twoD a { display: block; padding-left: 30px; font-size: 16px; color: #555; line-height: 28px; margin-top: 10px; } #subBody .location .oneD .twoD a.link { background: url('../../images/sub/twoD_link.gif') no-repeat left 100px top 50%} #subBody .location .oneD .twoD a:first-child { margin-top: 0; } #subBody .location .oneD .twoD a.current { color: #00448d; } @media (max-width: 1024px){ #subBody .subVisual { height: 300px; } #subBody .subVisual .visualTxt { padding-top: 150px; } #subBody .subVisual .visualTxt p.img { font-size: 30px; } #subBody .location { top: 238px; } #subBody .location, #subBody .location .inner { padding: 0; } #subBody .location .oneD { /* width: 43.555%; */ width: 29%; } #subBody .location .oneD a { width: 100%; } } @media (max-width: 600px){ #subBody .location { top: 175px; } #subBody .subVisual { height: 217px; } #subBody .subVisual.menu3 { height: 256px; } #subBody .subVisual .visualTxt { padding-top: 116px; } #subBody .subVisual .visualTxt p.img { font-size: 25px; } #subBody .location .home { width: 40px; height: 40px; background-size: 38%; } #subBody .location .oneD { width: calc(50% - 20px); height: 40px; } #subBody .location .three { width: 100%; border-top: 1px solid rgba(255, 255, 255, 0.4); } #subBody .location .oneD>a { height: 40px; padding: 13px 15px; font-size: 13px; } #subBody .location .oneD .twoD { top: 41px; padding: 5px 0 5px; } #subBody .location .oneD .twoD a { font-size: 14px; padding-left: 15px; margin-top: 0; } } .subWrap { width: 100%; margin-top: 62px; padding-bottom: 100px; overflow-x: hidden} @media (max-width: 1024px){ .subWrap { width: 100%; margin-top: 20px; padding-bottom: 50px; } } @media (max-width: 600px) { } h3.sub-tit { text-align: center; font-size: 38px; color: black; font-weight: 600; } h3.sub-tit p { font-size: 18px; margin-top: 20px; font-weight: 600; color: #666; } @media (max-width: 600px) { h3.sub-tit { font-size: 18px; } } /********** ICON **********/ .ico:before, .ico2:after, .icon, .ircom, .lnb .sub a:after { background-image: url(../../images/sub/ico.png); background-repeat: no-repeat; display: inline-block; vertical-align: middle; } .ico:before, .ico2:after { content: ''; } .icon, .ircom { padding: 0; margin: 0; white-space: nowrap; font-size: 1px; overflow: hidden; text-indent: -999px; color: transparent; line-height: 0; } #subBody .tabmenu { } #subBody .tabmenu ul { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; row-gap: 8px; column-gap: 2px; } #subBody .tabmenu li { margin: 25px 10px; } #subBody .tabmenu li a { position: relative; letter-spacing: 0.02em; color: #23232c; font-size: 18px; font-weight: 700; transition: all 0.3s ease-in-out; padding: 15px 50px; border: 2px solid #00b298; border-radius: 28px; display: inline-block; } #subBody .tabmenu li a:hover, #subBody .tabmenu li.on a { color: #fff; background: #00b298; } #subBody .tabmenu li a:hover:before { width: 100%; } #subBody .tabmenu li.on a:before { width: 100%; } /*추억의상점 홍보영상*/ #subBody .tabmenu li.point { margin-left: 25px; padding-left: 35px; border-left: 1px solid #ddd; } #subBody .tabmenu li.point a { border: 2px solid #c77241; } #subBody .tabmenu li.point a:hover, #subBody .tabmenu li.point.on a { background-color: #c77241; } @media all and (max-width: 950px){ #subBody .tabmenu li { margin: 15px 4px; } #subBody .tabmenu li a { padding: 10px 20px; } } @media all and (max-width: 640px){ #subBody .tabmenu li { margin: 0px 1px; } #subBody .tabmenu li a { font-size: 16px; padding: 8px 10px; } #subBody .tabmenu li.point { margin-left: 10px; padding-left: 15px; border-left: unset; } } /* 찾아오시는길 */ #com_map { max-width: 1400px; width: 100%; margin: 30px auto; } #com_map .box-add-visual { position: relative; display: flex; background: #f6f6f6; overflow: hidden; padding: 20px 30px; } #com_map .box-add-visual .vis { width: 112px; padding-left: 50px; } #com_map .box-add-visual .con { margin-left: 100px; padding: 40px; } #com_map .box-add-visual .con .btn1 { position: absolute; right: 100px; top: 55px; } #com_map .box-add-visual .con li { line-height: 1.5; float: left; } #com_map .box-add-visual .con li:first-child { margin-right: 70px; } #com_map .box-add-visual .con li strong { width: 100px; display: inline-block; color: #00a093; } #com_map .box-add-visual .con .btn1 { position: absolute; right: 100px; top: 55px; } #com_map .box-add-txt { background: #f6f6f6; padding: 30px 30px 0 30px; text-align: right; line-height: 150%; } @media all and (max-width: 880px){ #com_map .box-add-visual { display: block; padding: 10px 10px 50px 10px; } #com_map .box-add-visual .vis { display: none; } #com_map .box-add-visual .con { margin-left: 0px; padding: 20px; } #com_map .box-add-visual .con .btn1 { right: 0px; top: auto; bottom: 0; } } @media all and (max-width: 600px){ #com_map { } #com_map .box-add-visual { padding: 15px 15px 40px 15px; } #com_map .box-add-visual .vis { } #com_map .box-add-visual .con { padding: 0; } #com_map .box-add-visual .con .btn1 { } #com_map .box-add-visual .con li { display: flex; /*font-size: 14px; */} #com_map .box-add-visual .con li:first-child { margin-right: 0; } #com_map .box-add-visual .con li strong { flex-basis: 86px; flex-shrink: 0; } #com_map .box-add-visual .con .btn1 { } #com_map .box-add-txt { text-align: center; padding: 30px 15px 10px 15px; } } dl.traffic { display: flex; margin-top: 50px; margin-left: 70px; } dl.traffic dt { width: 300px; line-height: 6; font-size: 20px; font-weight: 500; color: #000; margin-right: 50px; flex-shrink: 0; } dl.traffic dt span { margin-left: 30px; } dl.traffic dd { line-height: 150%; font-size: 18px; } dl.traffic dd p { color: #00b298; padding: 15px 0; font-size: 18px; font-weight: bold; } @media (max-width: 1420px){ .root_daum_roughmap_landing { width: 100% !important; } } @media all and (max-width: 1024px) { dl.traffic { display: block; margin-top: 30px; margin-left: 30px; } dl.traffic dt { line-height: 4; } dl.traffic dt img { width: 66px; } dl.traffic dt span { margin-left: 15px; } dl.traffic dd { } dl.traffic dd p { } } @media all and (max-width: 600px) { dl.traffic { margin-left: 0px; } dl.traffic dt { line-height: 3; } dl.traffic dt img { width: 50px; } dl.traffic dt span { margin-left: 10px; } dl.traffic dd { margin-left: 5px; } dl.traffic dd p { padding: 10px 0; } } /* board_top_tab */ .board_top_tabs { margin-top: 60px; border-bottom: 2px solid #111; } .board_top_tab_list { display: flex; margin: 0 auto -4px auto; width: 80%; } .board_top_tab_list>li { width: 100%; } .board_top_tab_list>li>a { display: flex; color: #808080; font-size: 18px; border-top: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; border-bottom: 0px solid #fff; border-radius: 5px; padding: 15px 10px; transition: background 0.3s, color 0.3s; height: 100%; align-items: center; justify-content: center; } .board_top_tab_list>li>a:hover, .board_top_tab_list>li>a.active { border-top: 2px solid #111; border-left: 2px solid #111; border-right: 2px solid #111; border-bottom: 4px solid #fff; font-weight: 800; background-color: #fff; color: #111; } @media all and (max-width: 600px){ .board_top_tabs { margin-top: 20px; } .board_top_tab_list { width: 100%; } .board_top_tab_list>li { } .board_top_tab_list>li>a { font-size: 16px; padding: 8px 8px; } .board_top_tab_list>li>a:hover, .board_top_tab_list>li>a.active { } } /* search */ .bbs-search { position: relative; margin: 40px 0; padding: 20px 25px; background: #ebf9f7; text-align: center; } .bbs-search:after { clear: both; content: ''; display: block; } .bbs-search .tit { display: flex; float: left; font-size: 18px; margin: 15px 0 0 15px; color: #333; } .bbs-search .tit span { font-weight: 500; color: #00b298; } .bbs-search .form { float: right; } .bbs-search .form span { margin-right: 10px; color: #00b298; font-weight: 800; } .bbs-search .custom-select { display: inline-block; margin-right: 5px; } .bbs-search .custom-select select::-ms-expand { display: none; } .bbs-search .custom-select select { height: 45px; padding: 0 100px 0 20px; border: 0; font-size: 15px; font-weight: 600; color: #000; appearance: none; -webkit-appearance: none; background: #fff url(../../images/sub/arr_select.png) right 20px center no-repeat; background-size: 14px; border: 1px solid #e4e4e8; border-radius: 0; } .bbs-search .custom-select select:focus { outline: none; border-color: #5978d2; } .bbs-search .custom-search { height: 50px; background: #fff; } .bbs-search .custom-search input[type=search] { width: 100%; height: 70px; padding: 0 100px 0 20px; border: 1px solid #f9f9f9; box-sizing: border-box; background: #fff; } .bbs-search .custom-search input[type=search]:focus { border-color: #5978d2; } .bbs-search .custom-search input[type=button] { float: right; width: 70px; height: 70px; background: url(../../images/sub/btn_search.png) center center no-repeat; background-size: 26px; border: 0; font-size: 0; line-height: 0; position: absolute; top: 0; right: 10px; } .bbs-search .custom-search input[type=submit] { float: right; width: 70px; height: 70px; background: url(../../images/sub/btn_search.png) center center no-repeat; background-size: 26px; border: 0; font-size: 0; line-height: 0; position: absolute; top: 0; right: 10px; } .bbs-search .submit a { padding: 12px 30px 14px 30px; border: 1px solid #686868; background: #333333; color: #fff; border-radius: 5px; } @media all and (max-width: 800px){ .bbs-search { display: flex; flex-direction: column; margin: 20px 0; } .bbs-search:after { } .bbs-search .tit { margin: 0 0 10px 0px; /* align-self: center; */ display: block; width: 100%; } .bbs-search .tit span { } .bbs-search .form { float: unset; } .bbs-search .form span:not(.submit) { display: none; } .bbs-search .custom-select { } .bbs-search .custom-select select { padding: 0 90px 0 20px; } .bbs-search .custom-select select:focus { } .bbs-search .custom-search { } .bbs-search .custom-search input[type=search] { } .bbs-search .custom-search input[type=search]:focus { } .bbs-search .custom-search input[type=button] { } .bbs-search .custom-search input[type=submit] { } .bbs-search .submit a { } } @media all and (max-width: 600px){ .bbs-search .form { float: none; } .bbs-search { padding: 15px; margin: 20px 0; } .bbs-search .tit { display: block; text-align: left; font-size: 16px; width: 100%; margin: 0 0 10px 0; } .bbs-search .custom-select { width: 108px; margin-right: -4px; } .bbs-search .custom-select select { width: 100%; height: 40px; font-size: 14px; background: #fff url(../../images/sub/arr_select.png) right 15px center no-repeat; padding: 0 50px 0 15px; } .bbs-search .form span { display: none; } .bbs-search .form span.submit { display: block; width: 100%; margin-right: 0; margin-top: 10px; } .uix-form-text.size-xlarge.full { width: 100%; margin-right: 0; } .bbs-search .submit a { display: block; width: 100%; padding: 10px 20px 9px 20px; font-size: 15px; } } /* table style */ .table { width: 100%; } .table th:first-child, .table td:first-child { border-left: none; } .table th:last-child, .table td:last-child { border-right: none; } .tstyle_list { border-top: solid 2px #313131; border-bottom: solid 1px #313131; margin: 30px auto; padding: 30px 0; } .tstyle_list { color: #626262; table-layout: fixed; width: 100%; } .tstyle_list thead th { border-bottom: solid 1px #dcdbdb; color: #000; padding: 20px 0; } .tstyle_list td { border-bottom: solid 1px #dcdbdb; text-align: center; padding: 20px 0; } .tstyle_list td a { display: inline-block; vertical-align: middle; } .tstyle_list td.left { text-align: left; } .tstyle_list tbody th { border-bottom: solid 1px #dcdbdb; } .tstyle_list a.subject { display: flex; } .tstyle_list .thumb { width: 30%; margin-right: 20px; overflow: hidden; vertical-align: middle; } .tstyle_list .thumb img { width: 100%; height: 100%; } .tstyle_list .txt { width: 70%; text-align: left; padding: 20px; line-height: 1.3; } .tstyle_list .txt .tit { font-size: 25px; color: #000; font-weight: 800; margin-bottom: 15px; } .tstyle_list .txt .script { } .tstyle_list .icon_insta { display: inline-block; font-size: 0; background-image: url(https://gyeongju.go.kr/hwangridan/images/board/20230113025000653.png); background-repeat: no-repeat; background-size: 100%; width: 60px; height: 60px; } .tstyle_list .icon_blog { display: inline-block; font-size: 0; background-image: url(https://gyeongju.go.kr/hwangridan/images/board/20230113025000680.png); background-repeat: no-repeat; background-size: 100%; width: 60px; height: 60px; } .tstyle_list .icon_facebook { display: inline-block; font-size: 0; background-image: url(https://gyeongju.go.kr/hwangridan/images/board/20230113025000709.png); background-repeat: no-repeat; background-size: 100%; width: 60px; height: 60px; } .tstyle_list .icon_youtube { display: inline-block; font-size: 0; background-image: url(https://gyeongju.go.kr/hwangridan/images/board/20230113025000734.png); background-repeat: no-repeat; background-size: 100%; width: 60px; height: 60px; } .tstyle_list .cont_title .subject:hover { cursor: pointer; } .tstyle_list .cont_img { display: none; background: #f7f7f7; padding: 20px; } .tstyle_list .cont_img.on { display: table-row; } .tstyle_list .cont_img img { width: 100%; max-width: 700px; } .tstyle_list .cont_img .script { font-size: 19px; margin: 10px 0 20px; color: #000; } .auto-fit { table-layout: auto; width: auto; } .auto-fit th, .auto-fit td { width: auto; } .tstyle_list .thumb { max-width: 100px; max-height: 100px; } .tstyle_list td.i_img { white-space: nowrap; padding: 0 2px !important; } @media all and (max-width: 1200px){ .tstyle_list td { /* font-size: 14px; */} .tstyle_list .thumb { display: none; } .tstyle_list .txt { width: 100%; } .tstyle_list .txt .tit { font-size: 20px; } .tstyle_list .txt .script { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .tstyle_list .icon-bt { /* width: 80%; */} .tstyle_list thead th { font-size: 15px; } } @media all and (max-width: 800px){ .table colgroup { width: 100%; display: block; } .tstyle_list.t1>thead>tr>th { position: absolute; left: -9999px; width: 1px; height: 1px; font-size: 0; line-height: 0; overflow: hidden; opacity: 0; } .tstyle_list.t1 { display: block; border-width: 1px; padding: 0; } .tstyle_list.t1>tbody { display: block; width: 100%; } .tstyle_list.t1>tbody>tr { display: block; overflow: hidden; border-bottom: 1px solid #ddd; box-sizing: border-box; padding: 10px 10px; display: flex; flex-wrap: wrap; width: 100%; align-items: center; row-gap: 10px; } .tstyle_list.t1>tbody>tr:last-child { border-bottom: none; } .tstyle_list.t1>tbody>tr:last-child>th, .tstyle_list.t1>tbody>tr:last-child>td { border: 0; } .tstyle_list.t1>tbody>tr>th, .tstyle_list.t1>tbody>tr>td { display: block; float: left; border: 0; padding: 0; background-color: transparent; } .tstyle_list.t1>tbody>tr.tr_notice>th, .tstyle_list.t1>tbody>tr.tr_notice>td { background-color: transparent; } /*table일경우display: inline-block; 보다 공백 안생기고 깔끔하게 보임*/ .tstyle_list.t1>tbody>tr>th { position: absolute; left: -9999px; width: 1px; height: 1px; font-size: 0; line-height: 0; overflow: hidden; opacity: 0; } .tstyle_list.t1>tbody>tr>td.ellipsis { width: 100%; font-weight: 400; /* font-size: 15px; */ margin-top: 0; border-right: 0; } .tstyle_list.t1>tbody>tr>td.ellipsis~td { margin-right: 8px; padding-right: 8px; border-right: 1px solid #ddd; box-sizing: border-box; line-height: 16px; /* font-size: 12px; */ text-align: left; } .tstyle_list.t1>tbody>tr>td:last-child { border-right: 0 !important; } .tstyle_list.t1 .txt { padding: 0; } .tstyle_list.t1 .txt .tit { margin-bottom: 7px; } .tstyle_list .icon_insta { width: 30px; height: 30px; } .tstyle_list .icon_blog { width: 30px; height: 30px; } .tstyle_list .icon_facebook { width: 30px; height: 30px; } .tstyle_list .icon_youtube { width: 30px; height: 30px; } .tstyle_list .cont_img .script { font-size: 15px; text-align: left; margin: 20px 10px 20px; } .store_table td:not(.i_img) { width: 100%; text-align: left; border-right: unset; } .tstyle_list tr { display: flex; flex-wrap: wrap; flex-direction: column; column-gap: 6px; row-gap: 4px; } .tstyle_list td.tdTitle { order: -1; padding-bottom: 5px; font-weight: 500 !important; font-size: 16px !important; } .tstyle_list td:not(.tdTitle)::before { content: attr(data-label); display: inline-block; min-width: 45px; margin-right: 6px; padding: 1px 6px; font-size: 12px; color: #000000; background: #f3f4f6; border-radius: 4px; text-align: center; } } /* 포토게시판 기본스타일 */ .listType1 { margin: -10px; font-size: 0; } .listType1 li { display: inline-block; vertical-align: top; width: 16.6%; padding: 10px; box-sizing: border-box; } .listType1 li .link { display: block; } .listType1 li .link .imgBox { position: relative; border: 1px solid #ddd; -webkit-background-size: cover !important; background-size: cover !important; } .listType1 li .link .textBox { padding: 25px; text-align: center; } .listType1 li .link .textBox dt { font-size: 19px; font-weight: 700; color: #333; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .listType1 li .link .textBox dd { font-size: 14px; color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .listType1 li .link .vvh { width: 100%; max-height: 200px; } @media screen and (max-width: 1300px){ .listType1 li { width: 25%; } .listType1 li .link .textBox { padding: 15px; } .listType1 li .link .textBox .tel { font-size: 15px; } .listType1 li .link .textBox dt { font-size: 16px; } } @media all and (max-width: 750px){ .listType1 { margin: -5px; } .listType1 li { width: 33.3%; padding: 5px; } } @media all and (max-width: 600px){ .listType1 li .link .textBox { padding: 15px 5px; } .listType1 li .link .textBox dt { font-size: 15px; } } .listType2 { margin: -10px; font-size: 0; } .listType2 li { display: inline-block; vertical-align: top; width: 16.6%; padding: 10px; box-sizing: border-box; } .listType2 li { text-align: center; } .listType2 li .imgBox { position: relative; border: 1px solid #ddd; -webkit-background-size: cover !important; background-size: cover !important; margin-bottom: 20px; } .listType2 li .imgBox .vr { position: absolute; right: 0; top: 0; } .listType2 li .tit { font-size: 19px; font-weight: 700; color: #333; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .listType2 li .btn { font-size: 14px; color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .listType2 li .vvh { width: 100%; max-height: 200px; } /* 페이징 */ .paging { position: relative; margin-top: 30px; text-align: center} .paging ol { } .paging ol li { display: inline-block; vertical-align: middle; } .paging ol li+li { margin-left: 25px} .paging ol li a { display: block; width: 15px; height: 20px; line-height: 20px; color: #646464} .paging ol li.ov a { font-weight: bold; color: #323236; border-bottom: 2px solid #000} .paging ol li.pageArr { width: 50px; height: 50px} .paging ol li.pageArr a { width: 100%; height: 100%} .paging ol li.pageArr.prevBtn { margin-right: 0px; } .paging ol li.pageArr.prevBtn a { background-position: -439px -140px; } .paging ol li.pageArr.prevBtn:first-child a { background-image: url(/hwangridan/images/board/first.png); background-position: center center; } .paging ol li.pageArr.nextBtn { margin-left: 20px; } .paging ol li.pageArr.nextBtn a { background-position: -489px -140px; } .paging ol li.pageArr.nextBtn:last-child a { background-image: url(/hwangridan/images/board/last.png); background-position: center center; } @media screen and (max-width: 1024px){ .listType2 li { width: 20%} } @media screen and (max-width: 768px){ .listType2 li { width: 25%} } @media screen and (max-width: 640px){ .listType2 li { width: 33.33%} .paging ol li+li { margin-left: 15px; } .paging ol li.pageArr { width: 30px; height: 30px; margin-left: 0 !important; } .paging ol li.pageArr.nextBtn a { background-position: -494px -150px; } .paging ol li.pageArr.prevBtn a { background-position: -448px -150px; } } /* 상품체험 */ #product_top { position: relative; width: 100%; background: #f6f6f8; padding: 20px; margin-bottom: 50px; } #product_top .info_box { display: flex; } #product_top .info_box .img { width: 118px; margin-right: 30px; } #product_top .info_box .img img { width: 100%; } #product_top .info_box ul li { padding: 5px 10px; } #product_top .info_box ul li h3 { font-size: 25px; font-weight: 600; margin-bottom: 10px; } #product_top .info_box ul li span { width: 150px; } #product_top .link_box { position: absolute; right: 20px; top: 20px; } #product_top .link_box a { display: inline-block; margin: 10px 15px; text-align: center; } #product_top .link_box a p { margin-top: 15px; } @media screen and (max-width: 600px){ #product_top { margin-bottom: 20px; } #product_top .info_box { display: block; text-align: center; border-bottom: 1px solid #e9e9e9; padding-bottom: 10px; margin-bottom: 10px; } #product_top .link_box { position: unset; text-align: center; } #product_top .link_box a { margin: 10px; } #product_top .link_box a p { font-size: 14px; } #product_top .link_box img { max-width: 45px; } #product_top .info_box .img { width: 85px; margin: 0 auto 5px auto; } #product_top .info_box ul li h3 { font-size: 20px; } .listType2 li .imgBox { margin-bottom: 15px; } .listType2 li .tit { font-size: 15px; } } /* 레이어 팝업 */ .dn { display: none !important; } .layer_wrap { overflow-y: auto; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 210; } .layer_wrap .layer_wrap_cont { position: relative; border: 2px solid #555555; background: #ffffff; } .layer_wrap .ly_tit { padding: 18px 11px; border-bottom: 1px solid #999999; } .layer_wrap .ly_tit h4 { font-size: 18px; } .layer_wrap .ly_cont { min-height: 250px; padding: 15px 15px 26px 15px; } .layer_wrap .ly_close { display: block; position: absolute; top: 0px; right: 0px; padding: 20px; } /* 상품 확대보기 */ .layer_wrap.zoom_layer { top: 0; left: 0; } .layer_wrap.zoom_layer .layer_wrap_cont { width: 850px; } /* 상품 이미지 크게 보기 */ .layer_wrap .item_photo_view_box { float: none; position: relative; width: 100%; } .layer_wrap .item_photo_view { overflow: hidden; } .layer_wrap .item_photo_big { display: table-cell; position: relative; text-align: center; vertical-align: middle; } .layer_wrap .item_photo_big img { max-width: 100%; max-height: 100%; } /* 홍보영상-리스트*/ .movie-box2 { position: relative; margin: 80px auto 0 auto; width: 800px; text-align: center; } .sec02_slider01_list li { display: inline-block; width: 19.75%; height: 700px; vertical-align: top; } .sec02_slider01_list li .txt_box { display: block; margin: 20px 10px; color: #000; font-weight: 500; font-size: 16px; line-height: 1.3; } .sec02_slider01_list li .txt_box p { word-wrap: break-word; } .sec02_slider01_list li .txt_box .nick { position: relative; margin: 20px 0; } .sec02_slider01_list li .txt_box .nick span { font-size: 16px; font-weight: 300; margin-left: 30px; } .sec02_slider01_list li .txt_box i.nick01 { position: absolute; left: 0; top: -4px; width: 25px; height: 25px; } .sec02_slider01_list li .txt_box .date { margin: 10px 0; color: #888; font-size: 14px; font-weight: 300; } @media all and (max-width: 1200px){ .sec02_slider01_list li { width: 24.5%; } } @media all and (max-width: 960px){ .sec02_slider01_list li { width: 33%; } } @media all and (max-width: 860px){ .movie-box2 { width: 100%; } } @media all and (max-width: 760px){ .sec02_slider01_list li { width: 49.5%; } } @media all and (max-width: 600px){ .sec02_slider01_list li { width: 100%; height: 530px; } .sec02_slider01_list li iframe { height: 400px; } } /* event_photozone */ #event_photo_top { position: relative; background: url(../../images/sub/20250805023538376.png); width: 100%; height: 750px; } #event_photo_top .info_box { position: absolute; left: 0; top: 0; width: 370px; height: 750px; background-color: #07a58d; /* opacity: 0.8; */ color: #fff; padding: 30px 30px 30px; } #event_photo_top .info_box:before { content: ''; display: block; left: 0; top: 0; background: url(../../images/sub/icon_photozone1.png); width: 75px; height: 77px; margin-bottom: 20px; } #event_photo_top .info_box h3 { font-size: 28px; font-weight: 600; margin-bottom: 10px; line-height: 1.3; } #event_photo_top .info_box h3>p { font-size: 17px; font-weight: 400; } #event_photo_top .info_box>.text { position: relative; margin-top: 20px; font-size: 16px; font-weight: 400; line-height: 1.4; border-bottom: 1px solid rgba(255, 255, 255, 0.5); margin-bottom: 20px; padding-bottom: 20px; } #event_photo_top .info_box>.text:after { position: absolute; content: ''; display: block; right: -5px; bottom: -54px; background: url(../../images/sub/icon_photozone2.png); width: 111px; height: 87px; } #event_photo_top .info_box>ol { counter-reset: my-awesome-counter; font-size: 15px} #event_photo_top .info_box>ol li { counter-increment: my-awesome-counter; position: relative; margin: 7px 0; line-height: 160%; padding-left: 20px; letter-spacing: -1px; } #event_photo_top .info_box>ol li::before { content: counter(my-awesome-counter); position: absolute; top: 4px; left: 0; font-size: 13px; font-weight: 600; color: #fff; line-height: 1.2; width: 15px; height: 15px; border: 1px solid #fff; border-radius: 50%; text-align: center; } #event_photo_top .info_box>ol li a { color: #222; display: block; font-weight: 400; } #event_photo_top .info_box>ol li a span { border-bottom: 1px solid #333; display: inline-block; } #event_photo_top .info_box>ol li a span::after { content: ''; display: inline-block; width: 19px; height: 14px; overflow: hidden; background: url(/hwangridan/images/common/blank_icon.png) 5px -12px no-repeat; background-size: 12px; } .event_step { margin-top: 4%; } .event_step .tit { font-size: 25px; color: #000; font-weight: 800; margin: 20px 0; } .event_step ol { display: flex; } .event_step ol li { width: 25%; text-align: center; } .event_step ol li:not(:last-child) { background-image: url(https://gyeongju.go.kr/hwangridan/images/main/20230119102704346.jpg); background-repeat: no-repeat; background-position: center right; } .event_step ol li i { display: block; padding-top: 32%; text-align: center; background-image: url(../../images/sub/icon_photozone2.png); background-repeat: no-repeat; background-position: top center; } .event_step ol span { display: block; text-align: center; color: #000; font-size: calc(12px + 0.5vw); font-weight: 600; margin-top: 10px; } .event_list { margin-top: 50px; } .photo_box .tit { font-size: 25px; color: #000; font-weight: 800; margin: 20px 0; display: flex; align-items: center; } .photo_box .tit .num { display: inline-block; width: 40px; height: 40px; background: #00b298; text-align: center; font-size: 25px; color: #fff; line-height: 1.6; border-radius: 50%; font-weight: 400; margin-right: 10px; } .photo_box .tit .location_photo_box { display: inline-block; width: 22px; height: 25px; background: url(/hwangridan/images/sub/20250805054809816.png) center center no-repeat; margin-left: 10px; } .event_list .photo_box ul { display: flex; } .event_list .photo_box ul li { width: 49%; display: inline-block; } .event_list .photo_box ul li:first-child { margin-right: 2%; } .event_list .photo_box ul li img { width: 100%; } @media all and (max-width: 900px){ .event_step ol li:not(:last-child) { background-image: none; } .event_step ol li:not(:last-child) span:after { display: inline-block; content: ''; width: 15px; height: 10px; background-size: 15px; margin-left: 10px; background-image: url(https://gyeongju.go.kr/hwangridan/images/main/20230119102704346.jpg); background-repeat: no-repeat; background-position: center right; } } @media all and (max-width: 600px){ #event_photo_top { height: unset; background: no-repeat; } #event_photo_top .info_box { padding: 30px 20px 20px; width: auto; height: auto; display: block; position: unset; } #event_photo_top .info_box>.text { font-size: 18px; } #event_photo_top .info_box p { font-size: 18px; } #event_photo_top .info_box>ol li { font-size: 18px; line-height: 170%; } #event_photo_top .info_box>.text:after { bottom: -65px; } .photo_box .tit { font-size: 20px; font-weight: 600; margin: 20px 0 5px; } .photo_box .tit .num { width: 24px; height: 24px; font-size: 16px; line-height: 1.5; } .photo_box .tit .location_photo_box { background-size: 18px; margin-left: 2px; } .event_step { margin-top: 16%; } .event_step ol { flex-direction: column; } .event_step ol li { width: 100%; } .event_step ol li:not(:last-child) span:after { display: none; } .event_step ol li:not(:last-child) { background-image: url(https://gyeongju.go.kr/hwangridan/images/board/i-arrow-bottom.png); background-repeat: no-repeat; background-position: bottom center; padding-bottom: 7%; margin-bottom: 7%; } .event_step .tit { font-size: 16px; font-weight: 600; margin: 20px 0 15px; } .event_step ol li img { } } @media all and (max-width: 340px){ #event_photo_top { height: unset; background: no-repeat; } } /* treasure */ .treasure { text-align: center; margin: 0 auto; padding: 0; overflow: hidden; } .treasure-tit { text-align: center; font-size: 25px; color: black; margin-bottom: 50px; line-height: 1.4; } .treasure ul.treasure-cont { display: flex; } .treasure ul.treasure-cont li { position: relative; width: 33%; display: inline-block; margin: 30px; } .treasure ul.treasure-cont li h3 { font-size: 25px; color: #18152a; font-weight: 800; margin: 30px 0; } .treasure ul.treasure-cont li p { line-height: 1.3; } .treasure ul.treasure-cont li:first-child:after { display: none; } .treasure ul.treasure-cont li:after { position: absolute; left: -50px; top: 35%; content: ''; display: block; width: 44px; height: 44px; background: url(../../images/sub/ico_arrow.png); } .treasure ul.treasure-cont li img { width: 100%; } @media screen and (max-width: 1200px){ .treasure-tit { margin: 30px 0 20px; } .treasure ul.treasure-cont li:after { width: 20px; height: 20px; left: -38px; background-size: 100%; } .treasure ul.treasure-cont li img { width: 100%; } } @media screen and (max-width: 950px){ .treasure-tit { font-size: 22px; } .treasure ul.treasure-cont li:after { top: 25%; } .treasure ul.treasure-cont li h3 { font-size: 22px; margin: 20px 0; } } @media screen and (max-width: 760px){ .treasure ul.treasure-cont li h3 { font-size: 18px; } .treasure ul.treasure-cont li:after { top: 23%; } } @media screen and (max-width: 640px){ .treasure-tit { color: #666; font-size: 16px; line-height: 1.2; margin: 10px 0; } .treasure-tit strong { font-weight: 500; } .treasure-tit br { display: none; } .treasure ul.treasure-cont li { margin: 5px; } .treasure ul.treasure-cont li img { width: 80px; } .treasure ul.treasure-cont li h3 { font-size: 16px; line-height: 1.2; } .treasure ul.treasure-cont li:after { left: -25px; top: 17%; } .treasure ul.treasure-cont li p { font-size: 16px; } } /* login */ .login-tit { text-align: center; font-size: 25px; color: black; margin-bottom: 50px} .login { text-align: center; width: 500px; margin: 0 auto; padding: 0; overflow: hidden; } .login p { text-align: center; } .login p.subText_login { margin-bottom: 30px; font-size: 18px; line-height: 1.5em; font-weight: 700; color: white; padding: 40px 20px 30px 20px; background-color: #005ca9; } .login .login_box { } .login .login_box label { display: none} .login .login_box input:not(#idSaveCheck) { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; margin-bottom: 20px; background-color: white; border: 1px solid; height: 45px; padding: 10px; border: 1px solid #ddd; } .login .login_box .check { text-align: left; margin-bottom: 30px} .login .login_box .login-link { } .login .login_box .login-link input { vertical-align: middle; } .login .login_box .login-link span { vertical-align: middle; } .login .login_box .login-link span:first-child { margin-right: 9px; } .login .login_box .login-link span.line-h:after { display: inline-block; content: ''; border-right: 1px solid #ddd; height: 20px; padding-left: 9px; vertical-align: middle; } .login .btnLogin_area { margin: 30px 0; } .login .btnLogin_area .loginbtn { background-color: #05bda1; color: #fff; border-radius: 4px; text-align: center; } .login .btnLogin_area a { display: inline-block; padding: 15px 20px; margin-bottom: 10px; width: 100%; background: #222; color: #fff; border-radius: 4px; } .login .btnLogin_area a.joinbtn { background-color: #3e6b90} .login .sns .tit { color: #333; font-weight: 800; position: relative} .login .sns .tit:before { content: ''; display: block; width: 150px; height: 1px; background-color: #dddddd; position: absolute; top: 7px; left: 0px} .login .sns .tit:after { content: ''; display: block; width: 150px; height: 1px; background-color: #dddddd; position: absolute; top: 7px; right: 0px} .login .sns .list { overflow: hidden; font-size: 0; margin: 30px 0; } .login .sns .list li { display: inline-block; margin-right: 10px} .login .sns .list li:after { display: inline-block; content: ''; border-right: 1px solid #ddd; height: 20px; margin-right: 30px; padding-left: 30px; vertical-align: middle; } .login .sns .list li:last-child:after { display: none; } .login .sns .list li a { display: inline-block; vertical-align: middle; } .login .login_box .check>a { float: right; } .login .login_box .check .order2 { border-right: 1px solid #dddddd; padding-right: 10px; margin-right: 10px} .login_select { display: block; } .login_select .fl { float: left; } .login_select .fr { float: right; } .login.find_box { text-align: left; } .find_wrap { border-radius: 15px; border: 1px solid #dddddd; padding: 20px; } .login.find_box .login_box label { display: block; font-weight: 500; color: #333; cursor: none; margin-bottom: 10px; } .hint_select select { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; border: 1px solid #ddd !important; box-sizing: border-box; font-size: 16px; color: #333; background-image: url(/img/common/i-select.svg); background-repeat: no-repeat; background-position: right 10px center; padding: 10px; } @media all and (max-width: 600px){ .find_wrap { padding: 15px; } } /* join */ #join { } #join .cont { width: 100%; margin: 0 auto; max-width: 1400px; text-align: center; } #join .join-group-box { display: inline-block; width: 450px; margin-right: 20px; margin-top: 80px; } #join .join-group-box:last-child { margin-right: 0; border-left: 1px solid #ddd; } #join .join-group-box p { text-align: center; } #join .join-group-box .tit { line-height: 1.5; } #join .join-group-box .tit p { color: #333; font-size: 28px; font-weight: 600; vertical-align: middle; margin-bottom: 20px; } #join .join-group-box .tit p strong { font-size: 18px; } #join .join-group-box .join-btn { margin-top: 30px; text-align: center; } #join .join-group-box .join-btn a { color: #fff; border-radius: 50%; width: 150px; height: 150px; display: inline-block; padding-top: 35px; } #join .join-group-box .join-btn a span { display: block; padding-top: 20px; } #join .join-group-box:nth-child(1) .join-btn a { background-color: #05bda1; } #join .join-group-box:nth-child(2) .join-btn a { background-color: #474e61; } #join .join-group-box .join-btn a i { vertical-align: middle; display: inline-block; width: 34px; height: 34px; background-repeat: no-repeat; background-position: center center; margin: 0 auto; } #join .join-group-box:nth-child(1) .join-btn a i { background-image: url(../../images/sub/join_person.png); } #join .join-group-box:nth-child(2) .join-btn a i { background-image: url(../../images/sub/join_store.png); } @media all and (max-width: 963px){ #join .join-group-box:last-child { border-left: 0; } } @media all and (max-width: 600px) { #join .join-group-box, #join .join-group-box:last-child { width: 100%; border: 1px solid #ddd; margin-top: 20px; padding: 20px; } .loginW { } .login { width: 100%; } .login .login_box input:not(#idSaveCheck) { margin-bottom: 10px; } .login .btnLogin_area { margin-top: 10px; } .login .sns .list li:after { margin-right: 20px; padding-left: 20px; } } /* join-step2 */ #join h4 { margin-bottom: 20px; font-size: 18px; color: #00a093; } #join .terms_area { margin-top: 50px} #join .terms_area .terms_box { overflow-y: scroll; height: 300px; line-height: 1.6; padding: 20px; border: 1px solid #d8d8d8; background: #f9f9f9; border-bottom: none; color: #666; font-size: 14px; } #joina .terms_area .checkBox { position: relative; padding: 13px 20px; font-size: 13px; color: #666; background-color: #f2f2f2} #join .terms_area .checkBox input { position: absolute; right: 20px} #join .terms_area .terms_box .tit01 { margin-bottom: 30px; font-size: 16px; font-family: "notokr-medium"} #join .terms_area .terms_box .tit02 { margin-bottom: 5px} #join .terms_area .terms_box .txt { margin-bottom: 20px; color: #999} #join .terms_area .terms_box li { color: #999} #join .terms_area .terms_box ol { margin-bottom: 20px} #join .terms_area .terms_box>ol>li>ol { margin: 0 0 0 15px} #join .terms_area .terms_box .txt_list { margin-bottom: 0} #join .terms_area .terms_chk { border: 1px solid #ddd; padding: 10px 20px; } #join .terms_area .terms_chk:after { content: ""; display: block; clear: both} #join .terms_area .terms_chk>p { float: left; } #join .terms_area .terms_chk>span { float: right; display: block; } #join .terms_area .terms_chk>span>input, #join .terms_area .terms_chk>span>label { display: inline-block; vertical-align: middle; } #join .terms_area .terms_chk>span>label { margin-right: 10px; } #join .allChk { margin-top: 10px; } #join .allChk label { font-size: 14px; } /* 신청폼 */ .uix-register-type2 { position: relative; width: 100%; max-width: 1000px; margin: 30px auto; padding: 30px 0; border-top: 1px solid #e4e4e8; border-bottom: 1px solid #e4e4e8; } .uix-register-type2 .ani { display: inline-block; position: absolute; top: -67px; right: 0; width: 92px; height: 100px; } .uix-register-type2>div { padding: 0 30px; } .uix-register-type2 dl { display: flex; margin: 10px; } .uix-register-type2 dt:nth-child(3) { padding-left: 30px; } .uix-register-type2 dt { color: #000; width: 15%; font-size: 17px; line-height: 1.5; letter-spacing: -0.8px; text-align: left; color: #2b3f47; margin: 10px; vertical-align: middle; } /*.uix-register-type2 dt:before { content:''; display:inline-block; width:4px; height:4px; background:#e80032; vertical-align:middle; margin:0 10px 0 0; } */ .uix-register-type2 .essential:after { content: '*'; color: #d13044; display: inline-block; margin-left: 7px; } .uix-register-type2 dd { color: #000; font-size: 20px; line-height: 2; } .uix-register-type2 dd p { color: #666; font-size: 15px; } .uix-register-type2 dd.block { width: 83%; } .uix-register-type2 dd.radio_txt { font-size: 17px; line-height: 2.5; } .uix-register-type2 input.uix-form-text, .uix-register-type2 select.uix-form-text, .uix-register-type2 textarea.uix-form-text { width: 30%; border-radius: 5px; } @media all and (max-width: 1024px){ .uix-register-type2>div { padding: 0; } .uix-register-type2 dl { margin: 10px 0; } .uix-register-type2 dt:nth-child(3) { padding-left: 0px; } .uix-register-type2 dt { width: 18%; word-break: break-word; font-size: 15px; line-height: 1; } .uix-register-type2 dd { line-height: 1.5; font-size: 13px; } } @media all and (max-width: 600px){ .uix-register-type2 { margin: 20px 0; padding: 20px 0; } .uix-register-type2 dl { flex-direction: column; margin: 0px 0px 10px; } .uix-register-type2 dt { width: 100%; margin: 10px 0 6px; } .uix-register-type2 dd.block { width: 100%; } } /* Form text 고정-padding:0 14px; font-weight:350; */ .uix-form-text { display: inline-block; margin: 0 5px 0 0; padding: 0 14px; border: 1px solid #e4e4e8; border-radius: 0; background-color: #fff; color: #000; outline: 0; vertical-align: middle; font-weight: 350; } .uix-form-text::-ms-expand { border: 0; background-color: transparent; } .uix-form-text.size-small { height: 24px; font-size: 12px; } .uix-form-text { height: 30px; font-size: 13px; } .uix-form-text.size-large { height: 36px; font-size: 14px; } .uix-form-text.size-xlarge { height: 45px; font-size: 15px; } .uix-form-text.block { display: block; width: 100% !important; } .uix-form-text.active, .uix-form-text:focus { border-color: #46535f; } .uix-form-text[readonly] { background: #f6f6f6; } .uix-form-text[disabled] { background: #f6f6f6; cursor: not-allowed; } select.uix-form-text { padding: 5px 12px; } textarea.uix-form-text { height: 170px; padding: 7px 14px; } input[type="file"].uix-form-text { /* padding: auto; */} .uix-form-description { margin: 5px 0 0; padding: 15px 0; border-bottom: 1px solid #e4e4e8; } ul.uix-form-description { padding-left: 20px; } ul.uix-form-description li { list-style-type: disc; } .uix-form-help { margin: 3px 0 0; font-size: 12px; } @media all and (max-width: 600px){ .uix-form-text.size-xlarge { width: calc(100% - 109px); height: 40px; font-size: 15px; margin-right: 0; } #mberId { width: calc(100% - 123px); } #brno { width: calc(100% - 57px); } } /* Button */ .uix-button { position: relative; display: inline-block; padding: 0 14px; white-space: nowrap; cursor: pointer; vertical-align: middle; margin-bottom: 0; text-align: center; outline: 0; font-weight: 400; color: #fff; background: #b6b6b6; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: all 0.3s ease; -moz-transition: 0.3s ease; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; } .uix-button:hover { background-color: #fff; border-color: #e4e4e8; color: #999; } .uix-button:active, .uix-button.active { outline: 0; } .uix-button.disabled, .uix-button[disabled] { box-shadow: none; filter: alpha(opacity=65); opacity: 0.65; cursor: not-allowed; } .uix-button.block { display: block; width: 100%; } a.uix-button { text-decoration: none; margin-top: 1px; } button.uix-button.block { width: 100%; } .uix-button.size-small { height: 24px; line-height: 22px; font-size: 13px; } .uix-button { height: 30px; line-height: 28px; font-size: 12px; } .uix-button.size-large { height: 36px; line-height: 34px; font-size: 15px; } .uix-button.size-xlarge { height: 45px; line-height: 45px; font-size: 18px; } .uix-button.edge-radius { border-radius: 5px; } .uix-button.size-small.half-radius { border-radius: 12px; } .uix-button.half-radius { border-radius: 15px; } .uix-button.size-large.half-radius { border-radius: 18px; } .uix-button.size-xlarge.half-radius { border-radius: 21px; } .uix-button.color-primary { background-color: #00a093; color: #fff; } .uix-button.color-primary:hover { border-radius: 0px; } .uix-button.color-border-primary { background-color: #fff; border: 1px solid #00a093; color: #00a093; } .uix-button.color-border-primary:hover { border-radius: 0px; } .uix-button.color-gray { background-color: #5c5c5c; color: #fff; } .uix-button.color-gray:hover { border-radius: 0px; } .uix-button.color-border-gray { background-color: #fff; border: 1px solid #5c5c5c; color: #5c5c5c; } .uix-button.color-border-gray:hover { border-radius: 0px; } .uix-button.color-border-red { background-color: #fff; border: 1px solid #ce0d2c; color: #ce0d2c; } .uix-button.color-border-red:hover { border-radius: 0px; } @media all and (max-width: 600px){ .uix-button { height: 40px !important; font-size: 15px !important; } .uix-button.size-large { height: 30px; line-height: 29px; font-size: 13px; } } /* mypage-sub */ .sub_con_area { float: left; width: 100%; max-width: 900px; } .h3 { font-size: 28px; color: #333; font-weight: 600; } #side { display: block; float: left; width: 250px; margin: 0; padding: 0; margin-right: 50px; } #side .sub_title { margin-bottom: 20px; color: #1c1c1b; font-size: 30px; font-weight: 800; } .sub_menu .sm_2th { } .sub_menu .sm_2th>li { margin: 0; padding: 0; border-bottom: solid 1px #1c1c1b; border-top: none; } .sub_menu .sm_2th>li:first-child { border-top: solid 1px #1c1c1b; } .sub_menu .sm_2th>li>a { display: block; position: relative; padding: 20px 15px; color: #333; font-size: 17px; } .sub_menu .sm_2th>li.on>a { color: #fff; background: #1c1c1b; } @media all and (max-width: 1240px){ #side { display: none; } .sub_con_area { float: unset; margin: 0 auto; } } /* culture */ .culture-tit { text-align: center; font-size: calc(14px + 0.7vw); color: black; margin-bottom: 4%; line-height: 1.4; } .culture { text-align: center; margin: 0 auto; padding: 0; overflow: hidden; } /* culture slider */ .culture .slider { } .culture .slick-slide img { width: 100%; } .culture .slick-prev:before, .culture .slick-next:before { color: black; } .culture .slick-slide { transition: all ease-in-out .3s; opacity: 0; margin: 0px 9px; } .culture .slick-active { opacity: .4; margin-right: -150px; margin-top: 100px; } .culture .slick-current { opacity: 1; max-width: 770px; margin-top: 0; } .culture .slick-current>div { margin: 0 !important} .culture .slick-current div div { } .culture .slick-current { position: relative; } .culture .slick-current .text { display: block; text-align: center; } .culture .slick-current .text h2 { font-size: calc(14px + 2vw); margin: 5% 0; } .culture .slick-current .text p { font-size: calc(14px + 0.5vw); } @media all and (max-width: 768px){ .culture .slick-slide { margin: 0; } .culture .slick-active { margin-right: 0; } } /* Slider */ .culture .slick-loading .slick-list { background: #fff url('./ajax-loader.gif') center center no-repeat; } /* Slider */ .culture .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .culture .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .culture .slick-list:focus { outline: none; } .culture .slick-list.dragging { cursor: pointer; } .culture .slick-slider .slick-track, .culture .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .culture .slick-list.draggable { padding: 0 !important; } .culture .slick-list.draggable>.slick-track { } .culture .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .culture .slick-track:before, .culture .slick-track:after { display: table; content: ''; clear: both; } .culture .slick-loading .slick-track { visibility: hidden; } .culture .slick-slide { display: none; float: left; min-height: 1px; } .culture [dir='rtl'] .slick-slide { float: right; } .culture .slick-slide img { display: block; } .culture .slick-slide.slick-loading img { display: none; } .culture .slick-initialized .slick-slide { display: block; } .culture .slick-slide.slick-cloned { max-width: 450px; } .culture .slick-slide.slick-active:not(.slick-current) { max-width: 450px; } .culture .slick-slide>div { } .culture .slick-loading .slick-slide { visibility: hidden; } .culture .slick-active>div .text { display: none; } .culture .slick-current>div .text { display: block; } .culture .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .culture .slick-arrow.slick-hidden { display: none; } @media all and (max-width: 768px){ .culture .slick-slide.slick-cloned { max-width: 100%; } } /* Arrows */ .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 235px; display: block; width: 50px; height: 101px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; /* color: transparent; */ border: none; outline: none; z-index: 9; } .slick-prev { left: 32px; background: url(../../images/sub/arrow_btn_left.png); } .slick-next { right: 30px; background: url(../../images/sub/arrow_btn_right.png); } @media all and (max-width: 768px) { .slick-prev, .slick-next { top: calc(50% - 30px); width: 25px; height: 40px; background-size: contain; background-repeat: no-repeat; } .slick-prev { left: 10px; background-position: center left; } .slick-next { right: 10px; background-position: center right; } } /* Dots */ .slick-dotted.slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; display: none !important; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { opacity: .75; color: black; } @media all and (max-width: 1024px) { } /* 상점정보 추가 */ @media all and (max-width: 600px){ .tstyle_list.t1.store_table>tbody>tr { position: relative; padding: 10px 0px 15px 0px; row-gap: 10px; } .i_img img { max-width: 18px; } .tstyle_list.t1.store_table>tbody>tr>td .i_home, .tstyle_list.t1.store_table>tbody>tr>td .i_vr { position: absolute; } .i_home img, .i_vr img { max-width: 30px; } .i_home { right: 50px; bottom: 10px; } .i_vr { right: 0; bottom: 10px; } } /*포토존 영상보기*/ .photozone { background-color: #0009; z-index: 9999; } .photozone .layer_wrap_cont.video_wrap { position: absolute; margin: 0px; top: 150px; left: calc(50% - 425px); } @media all and (max-width: 900px){ .photozone .layer_wrap_cont.video_wrap { left: 5%; width: 90%; } .photozone .layer_wrap_cont.video_wrap .youtube_frame { width: 100%; height: 350px; } } @media all and (max-width: 600px){ .photozone .layer_wrap_cont.video_wrap { left: 5%; width: 90%; } .photozone .layer_wrap_cont.video_wrap .youtube_frame { width: 100%; height: 280px; } } /*상점정보 - 목록상단 경주문화관광 배너, 인스타 안내글 store_top_contants*/ .store_top_contants { width: 100%; overflow: hidden; margin: -25px 0 -10px; } .store_top_contants .gyeongju_culture { width: 300px; height: 70px; display: block; font-size: 0; float: left; background: url(https://gyeongju.go.kr/hwangridan/images/sub/20231116114224798.jpg) no-repeat center top; } .store_top_contants p { position: relative; margin-top: 50px; padding-left: 27px; float: right; text-align: left; line-height: 140%; } .store_top_contants p::before { content: ''; margin-bottom: -4px; margin-right: 3px; width: 21px; height: 19px; display: inline-block; background: url(https://gyeongju.go.kr/hwangridan/images/sub/20231116114224821.png) no-repeat; } @media all and (max-width: 800px){ .store_top_contants { text-align: center; margin: -10px 0 -10px; } .store_top_contants .gyeongju_culture { width: 100%; max-width: 300px; float: unset; margin: 10px auto; background-size: 100%; } .store_top_contants p { display: inline-block; float: unset; margin: 10px auto 0; } } /*갤러리게시판*/ .gallery_list { width: 100%; margin: 30px 0; } .gallery_list ul { width: 100%; overflow: hidden; display: flex; justify-content: flex-start; flex-wrap: wrap; } .gallery_list ul li { width: 32.5%; text-align: center; margin: 20px 0; margin-right: 1.2%; } .gallery_list ul li:nth-child(3n) { margin-right: 0; } .gallery_list ul li .img_box { width: 100%; /* height: 450px; */ overflow: hidden; } .gallery_list ul li .img_box img { width: 320px; height: 420px; } .gallery_list ul li .text_box { font-size: 19px; line-height: 23px; padding: 15px 0 10px; color: #000; } .gallery_list ul li .text_box span { display: block; width: 70px; height: 24px; margin: 10px auto; font-size: 15px; line-height: 25px; /* background: #05bda1; */ color: #666; border-radius: 5px; } .gallery_list.w_4 ul li { width: 24%; margin-right: 1.3%; } .gallery_list.w_4 ul li:nth-child(3n) { margin-right: 1.3%; } .gallery_list.w_4 ul li:nth-child(4n) { margin-right: 0; } @media screen and (max-width: 1024px){ .gallery_list ul li .text_box { font-size: 16px; line-height: 19px; padding: 15px 0 10px; } } @media screen and (max-width: 760px){ .gallery_list ul li { width: 49%; margin-right: 2%; } .gallery_list ul li:nth-child(3n) { margin-right: 2%; } .gallery_list ul li:nth-child(2n) { margin-right: 0; } .gallery_list.w_4 ul li { width: 32.5%; margin-right: 1.2%; } .gallery_list.w_4 ul li:nth-child(3n) { margin-right: 0; } .gallery_list.w_4 ul li:nth-child(4n) { margin-right: 1.2%; } } @media screen and (max-width: 500px){ .gallery_list ul li .text_box { font-size: 15px; line-height: 17px; padding: 15px 0 5px; } .gallery_list ul { justify-content: space-around; } .gallery_list ul li { width: 80%; margin: 10px 0; } .gallery_list.w_4 ul li { width: 49%; margin-right: 2%; } .gallery_list.w_4 ul li:nth-child(2n) { margin-right: 0; } .gallery_list.w_4 ul li:nth-child(2n-1) { margin-right: 2%; } } /*------------지금 여기 황리단----------------*/ /*슬라이드 이미지 gallery_slide_wrap*/ .gallery_slide_wrap .slider-for { max-width: 1100px; width: 100%; height: auto; margin: 30px auto 1px; overflow: hidden; box-sizing: border-box; } .gallery_slide_wrap img { width: 100%; min-height: 100%; } /*control navigation - slider-nav*/ .gallery_slide_wrap .slider-nav { max-width: 800px; width: 100%; margin: 50px auto; display: block; } .gallery_slide_wrap .slider-nav .item { margin: 0 auto; border: 3px solid #d1d1db; box-sizing: border-box; } .gallery_slide_wrap .slider-nav .slick-slide { opacity: 0.6; transition: all 0.3s; transform: scale(0.8); } .gallery_slide_wrap .slider-nav .slick-slide:hover { opacity: 1; transform: scale(0.9); } .gallery_slide_wrap .slider-nav .slick-slide.slick-current { opacity: 1; transform: scale(1); } .gallery_slide_wrap .slider-nav .slick-arrow { position: absolute; top: 65px; z-index: 50; margin-top: -12px; width: 30px; height: 30px; border-radius: 15px; background: #61d6c5; background-size: 7px; background-repeat: no-repeat; background-position: center center; } .gallery_slide_wrap .slick-arrow.slick-prev:hover, .gallery_slide_wrap .slick-arrow.slick-prev:focus, .gallery_slide_wrap .slick-arrow.slick-next:hover, .gallery_slide_wrap .slick-arrow.slick-next:focus { background: #009e86; } .gallery_slide_wrap .slider-nav .slick-prev { left: -40px; background-image: url(https://gyeongju.go.kr/hwangridan/images/sub/arrow_btn_left.png); } .gallery_slide_wrap .slider-nav .slick-next { right: -40px; background-image: url(https://gyeongju.go.kr/hwangridan/images/sub/arrow_btn_right.png); } @media screen and (max-width: 1420px) { } @media screen and (max-width: 900px){ .gallery_slide_wrap .slider-nav .slick-arrow { top: 70%; } .gallery_slide_wrap .slider-nav .slick-prev { left: 0; } .gallery_slide_wrap .slider-nav .slick-next { right: 0; } } @media screen and (max-width: 600px) { } /*타이틀영역*/ .monthly_wrap .main_top { width: 100%; max-width: 1920px; margin: 0 auto; } .monthly_wrap .main_top .monthly_tit { width: 100%; height: 230px; background: url(https://gyeongju.go.kr/hwangridan/images/monthly/title_bg.png); position: relative; } .monthly_wrap .main_top .monthly_tit .title { width: 430px; margin: 0 auto; display: flex; padding-top: 75px; } .monthly_wrap .main_top .monthly_tit .title .tit_img { width: calc(100% - 100px); max-width: 321px; } .monthly_wrap .main_top .monthly_tit .title .tit_img img { width: 100%; } .monthly_wrap .main_top .monthly_tit .title .date { margin-left: 10px; flex-shrink: 0; } .monthly_wrap .main_top .monthly_tit .title p { font-size: 18px; font-weight: 400; line-height: 23px; letter-spacing: -1px; } .monthly_wrap .main_top .monthly_tit .title p.vol { font-size: 23px; font-weight: 600; margin-top: 18px; } /*메인 대문사진*/ .monthly_wrap .main_top .main_img { width: 100%; max-width: 1920px; margin: 0 auto; } .monthly_wrap .main_top .main_img img { width: 100%; } /*기본사항*/ .monthly_wrap { font-size: 18px; } .monthly_wrap .bg_beige { background-color: #fdfcf6; } .monthly_wrap .bg_gray { background-color: #f5f5f5; } .monthly_wrap .cont_inner { max-width: 1300px; margin: 0 auto; } .monthly_wrap .contents_box { /* margin: 0 0 100px; */ padding: 100px 0 80px; } .monthly_wrap .contents_box.last { border-bottom: 0; } .monthly_wrap .subTit { text-align: center; margin-bottom: 40px; } .monthly_wrap h3 { font-size: 35px; font-weight: bold; color: #05bda1; margin-bottom: 15px; } .monthly_wrap .subTit p { margin-top: 5px; font-size: 18px; font-weight: 600; line-height: 28px !important; } .monthly_wrap .img { margin: 10px 0; } .monthly_wrap .img.mt { margin-top: 5%; } .monthly_wrap .img img { width: 100%; } /*리드글 lead_txt*/ .monthly_wrap .main_top .lead_txt { padding: 30px 0; text-align: center; font-size: 20px; font-weight: 500; } .monthly_wrap .main_top .lead_txt::before, .monthly_wrap .main_top .lead_txt::after { content: ''; display: block; width: 70px; height: 3px; background-color: #05bda1; margin: 30px auto; } .monthly_wrap .main_top .text { padding: 4% 5%; /* text-align: center; */ border: 1px solid #ccc; margin: 4%; line-height: 150%; } .monthly_wrap .main_top .text h3 { font-size: 25px; margin-bottom: 10px; } /*컨텐츠 영역*/ .monthly_wrap .contents_box .img .img_box { position: relative; } .monthly_wrap .contents_box .img .img_box>div { position: relative; } .monthly_wrap .contents_box .img p { display: block; padding: 0 8px; border-radius: 10px; position: absolute; bottom: 5px; right: 5px; font-size: 0.8em; color: #fff; background: rgba(0, 0, 0, 0.5); } .monthly_wrap .contents_box .img p.exp { position: unset; display: inline-block; float: right; font-size: 0.9em; background: unset; color: #444; margin-top: 5px; } .monthly_wrap .contents_box .img.num02 .img_box { display: flex; justify-content: space-between; margin-bottom: 10px; } .monthly_wrap .contents_box .img.num02 .img_box>div { width: 49.7%; } .monthly_wrap .contents_box .img.num03 .img_box { display: flex; justify-content: space-between; margin-bottom: 10px; } .monthly_wrap .contents_box .img.num03 .img_box>div { width: 33%; margin-bottom: 30px; } .monthly_wrap .contents_box .text { margin: 50px 0; } .board_content .content .con .monthly_wrap .contents_box .text { line-height: 170%; } .board_content .content .con .monthly_wrap .contents_box .text .em { border-bottom: 2px solid #05bda1; } .monthly_wrap .contents_box .img.imgTxtBox .img_box { display: flex; justify-content: space-between; margin-bottom: 20px; flex-wrap: wrap; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_img { width: 35%; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_txt { width: 65%; padding: 2% 3%; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_txt02 { padding: 4% 3% 8%; } .monthly_wrap .contents_box .img.imgTxtBox .img_box h5 { font-weight: bold; font-size: 20px; margin-bottom: 5px; border-left: unset; padding-left: 0; } .monthly_wrap .contents_box .img.imgTxtBox .img_box h5::before { content: '❯'; margin-right: 8px; color: #05bda1; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .add { display: inline-block; margin-top: 20px; color: #00a093; border-bottom: 1px solid #00a093; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .add.no_line { border-bottom: unset; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_txt02 .add { border-bottom: none} .monthly_wrap h4 { font-size: 23px; font-weight: 600; position: relative; margin: 80px 0 15px; } .monthly_wrap h4.check { padding-left: 32px; } .monthly_wrap h4.check::before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 25px; height: 25px; background: url(https://gyeongju.go.kr/hwangridan/images/monthly/icon_check.png); } .monthly_wrap h4.check.right::before { background: url(https://gyeongju.go.kr/hwangridan/images/monthly/icon_right.png); } .monthly_wrap .inform { margin: 30px 0 50px; padding-left: 15px; } .monthly_wrap .inform h5 { border-left: 5px solid #55555550; padding-left: 8px; font-size: 21px; font-weight: 600; margin-bottom: 15px; } .monthly_wrap ul.dot_list li { line-height: 180%; position: relative; padding-left: 15px; } .monthly_wrap ul.dot_list li::before { content: ''; display: block; position: absolute; left: 0px; top: 11px; width: 5px; height: 5px; border-radius: 5px; background: #888; } .monthly_wrap ul.dot_list li p { margin-left: 65px; } .gallery_slide_wrap { } .monthly_wrap .bd_left { border-left: 1px solid #ccc; } @media screen and (max-width: 900px){ .monthly_wrap .contents_box .img.num03 .img_box>div { width: 48%; } .monthly_wrap .contents_box .img.imgTxtBox .img_box h5 { font-size: 17px; } .monthly_wrap .inform h5#mb_set1 { margin-bottom: 10px; } } @media screen and (max-width: 450px){ .monthly_wrap .contents_box .img.num03 .img_box>div { width: 80%; margin: 0 auto; } } /*이벤트*/ .event_box { margin: 3% 5%; padding: 4% 5%; border: 1px solid #05bda1; } .event_box.w_100 { margin: 3% 0; } .event_box .qna p { font-size: 20px; font-weight: 600; line-height: 28px !important; margin-bottom: 15px; } .event_box .qna p.conTit { font-size: calc(16px + 0.6vw); font-weight: 600; line-height: 150% !important; } .event_box .qna p span.tag { display: inline-block; background-color: #05bda1; color: #fff; border-radius: 10px; padding: 2px 10px; margin-right: 3px; } .event_box .qna .exp_txt { font-size: 17px; } .monthly_wrap .megaphone { position: relative; display: inline-block; /* text-decoration: underline #fd8378; */ padding: 3px 5px 3px 50px; border-bottom: 1px solid #fd8378; } .monthly_wrap .megaphone::before { content: ''; position: absolute; left: 0px; top: -8px; display: block; width: 50px; height: 50px; background: url(https://gyeongju.go.kr/hwangridan/images/monthly/megaphone.png) no-repeat; } @media screen and (max-width: 1420px){ .monthly_wrap .cont_inner { padding: 0 20px; } } @media screen and (max-width: 900px){ .monthly_wrap { font-size: 16px; } .monthly_wrap .main_top .monthly_tit { height: 150px; } .monthly_wrap .main_top .monthly_tit .title { width: 350px; padding-top: 50px; } .monthly_wrap .main_top .monthly_tit .title .date p { font-size: 15px; line-height: 18px; } .monthly_wrap .main_top .monthly_tit .title .date p.vol { font-size: 18px; margin-top: 15px; } .monthly_wrap .main_top .main_img { width: 160%; margin-left: -30%; } .monthly_wrap .main_top .text h3 { font-size: 22px; } .monthly_wrap .main_top .lead_txt { font-size: 15px; } .monthly_wrap .contents_box .img.imgTxtBox .img_box { flex-wrap: wrap; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_img { width: 100%; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_txt { width: 100%; padding: 10px 0; } .monthly_wrap .contents_box .img.imgTxtBox .img_box .div_txt h5 { font-size: 17px; margin-bottom: -15px; } .monthly_wrap h3 { font-size: 27px; margin-bottom: 10px; } .monthly_wrap .subTit p { font-size: 18px; } .monthly_wrap .inform h5 { font-size: 17px; } .monthly_wrap h4 { font-size: 19px; } .monthly_wrap h4.check { padding-left: 25px; } .monthly_wrap h4.check::before { top: 2px; left: 0; width: 20px; height: 20px; background: url(https://gyeongju.go.kr/hwangridan/images/monthly/icon_check.png); background-size: 100%; } .event_box .qna p { font-size: 17px; } .event_box .qna .exp_txt { font-size: 15px; } } @media all and (max-width:768px){ .event_box .qna p.conTit br { display: none; } } @media screen and (max-width: 600px){ .monthly_wrap { /* font-size: 15px; */} .monthly_wrap .main_top .monthly_tit .title { width: 250px; padding-top: 60px; } .monthly_wrap .main_top .monthly_tit .title .tit_img { width: calc(100% - 80px); } .monthly_wrap .main_top .monthly_tit .title .date p { font-size: 16px; line-height: 16px; } .monthly_wrap .main_top .monthly_tit .title .date p.vol { font-size: 16px; margin-top: 5px; } .monthly_wrap .main_top .main_img { width: 200%; margin-left: -50%; } .monthly_wrap .main_top .text h3 { font-size: 20px; } .monthly_wrap .contents_box { padding: 50px 0 30px; } .monthly_wrap h3 { font-size: 25px; margin-bottom: 10px; } .monthly_wrap h4 { font-size: 18px; } .monthly_wrap .contents_box .img.num02 .img_box { margin-bottom: 2px; } .monthly_wrap .img { margin: 5px 0; } .monthly_wrap ul.dot_list li { line-height: 20px; margin-bottom: 10px; } .monthly_wrap ul.dot_list li p { margin-left: 0px; margin: 0px 0 5px; line-height: 20px !important; } .event_box { margin: 3% 0; } .monthly_wrap ul.dot_list li::before { top: 6px; } } /*컨텐츠 개요 Contents Overview*/ .monthly_wrap .overview { padding: 70px 0 50px; text-align: center; } .monthly_wrap .overview h3 { font-size: 29px; display: inline-block; border-top: 3px double #05bda1; border-bottom: 3px double #05bda1; padding: 18px 5px; } .monthly_wrap .overview ul { margin-top: 30px; display: inline-block; text-align: left; } .monthly_wrap .overview ul li { padding: 10px 0; font-size: 19px; } .monthly_wrap .overview ul li .category { display: inline-block; border: 1px solid #00448d; border-radius: 5px; width: 100px; height: 28px; text-align: center; line-height: 26px; font-size: 16px; margin-right: 5px; } .monthly_wrap .overview ul li.overview_01 .category { color: #00448d; border: 1px solid #00448d; } .monthly_wrap .overview ul li.overview_02 .category { color: #792f8d; border: 1px solid #792f8d; } .monthly_wrap .overview ul li.overview_03 .category { color: #d85a8d; border: 1px solid #d85a8d; } .monthly_wrap .overview ul li.overview_04 .category { color: #008851; border: 1px solid #008851; } .monthly_wrap .overview ul li.overview_05 .category { color: #984600; border: 1px solid #984600; } .monthly_wrap .overview ul li .btn02 { font-size: 16px; margin-left: 5px; } @media screen and (max-width: 900px){ .monthly_wrap .overview h3 { font-size: 24px; padding: 12px 5px; } .monthly_wrap .overview ul { margin-top: 15px; } .monthly_wrap .overview ul li { padding: 7px 0; font-size: 16.5px; } .monthly_wrap .overview ul li .category { width: 68px; height: 25px; text-align: center; line-height: 23px; font-size: 14px; margin-right: 2px; } .monthly_wrap .overview ul li .btn02 { font-size: 15px; margin-left: 2px; } } /*관리자페이지 - 쿠폰관리-쿠폰정보-미리보기240605*/ .coupon_view .item_photo_big { width: 445px; height: auto; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; padding: 100px 0 80px; } .coupon_view .item_photo_big.bg01 { background: url(https://gyeongju.go.kr/hwangridan/images/food/coupon_bimg1.png) no-repeat; background-size: 100% 100%; } .coupon_view .item_photo_big.bg02 { background: url(https://gyeongju.go.kr/hwangridan/images/food/coupon_bimg2.png) no-repeat; background-size: 100% 100%; } .coupon_view .item_photo_big.bg03 { background: url(https://gyeongju.go.kr/hwangridan/images/food/coupon_bimg3.png) no-repeat; background-size: 100% 100%; } .coupon_view .item_photo_big.bg04 { background: url(https://gyeongju.go.kr/hwangridan/images/food/coupon_bimg4.png) no-repeat; background-size: 100% 100%; } .coupon_view h1 { /*수정 23-01-31*/ font-size: 50px; font-weight: 800; margin-bottom: 40px; margin-top: -50px; /* letter-spacing: 10px; */ text-align: center; } .coupon_view h1 span { font-size: 15px; display: block; height: 70px; line-height: 50px; text-align: center; } .coupon_view .img { display: flex; position: relative; justify-content: center; left: -3%; margin-bottom: 10px; } .coupon_view .img img { width: 90%; max-width: 280px; } .coupon_view .percent { font-size: 26px !important; color: #000; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-weight: 800; margin: 0; padding: 0 40px; } .coupon_view .txt { font-size: 36px; font-weight: 600; padding: 0 40px; margin-bottom: 10px; } .coupon_view .date { font-size: 19px; font-weight: 400; color: #333; margin: 0; padding: 0 40px; } .coupon_view .uses { font-size: 16px; margin-top: 10px; color: #333; font-weight: 400; /* padding: 0 40px; */} .coupon_view .logoimg { width: 30%; display: flex; margin: auto; } /* 24.11.25 상점정보 유튜브 아이콘 추가 */ .tstyle_list .icon_youtube.not_link { background-image: url(https://gyeongju.go.kr/hwangridan/images/board/20241125092034630.png); } /*25.05.27. 생활문화센터*/ .cultural_center { margin-top: 100px; } .center_list { } .center_list>ul>li { display: flex; margin-bottom: 50px; } .center_list .img_box { width: 490px; } .center_list .img_box img { width: 100%; } .center_list .txt_box { width: calc(92% - 490px); margin-left: 7%; } .center_list .txt_box h4 { font-size: 28px; font-weight: bold; color: #000; padding: 10px 0 20px; } .center_list .txt_box .exp { color: #666; font-size: 18px; line-height: 26px; padding-bottom: 30px; } .center_list .txt_box { } .dot_list li { position: relative; font-size: 18px; color: #000; line-height: 23px; margin-bottom: 5px; padding-left: 12px; } .dot_list li::before { content: ''; display: block; width: 4px; height: 4px; background: #000; border-radius: 2px; position: absolute; left: 0; top: 10px; } @media screen and (max-width: 1024px){ .cultural_center { margin-top: 60px; } .center_list .img_box { width: 40%} .center_list .txt_box { width: 55%; margin-left: 5%; } .center_list .txt_box h4 { font-size: 22px; } .center_list .txt_box .exp { font-size: 16px; line-height: 22px; padding-bottom: 15px; } .dot_list li { position: relative; font-size: 16px; color: #000; line-height: 20px; } .dot_list li::before { top: 7px; } } @media screen and (max-width: 600px){ .center_list>ul>li { display: block; margin-bottom: 70px; } .center_list .img_box { width: 100%; max-width: 490px; margin: 0 auto; } .center_list .txt_box { width: 100%; margin-left: unset; } .center_list .txt_box h4 { text-align: center; padding: 20px; } .center_list .txt_box .exp { text-align: center; } } .cultural_center .multi_room { display: flex; justify-content: space-between; margin-bottom: 80px; } .cultural_center .multi_room .img_box { width: 45%; } .cultural_center .multi_room .img_box img { width: 100%; } .cultural_center .multi_room .txt_box { width: 50%; } .cultural_center .multi_room .txt_box h3 { font-size: 27px; color: #000; font-weight: bold; padding: 0px 0 30px; } .cultural_center .multi_room .txt_box ul { border-top: 2px solid #000; } .cultural_center .multi_room .txt_box ul li { padding: 17px 0; border-bottom: 1px solid #dcdbdb; display: flex; } .cultural_center .multi_room .txt_box ul li .name { color: #000; font-weight: 600; display: block; width: 20%; text-align: center; } .cultural_center .multi_room .txt_box ul li .text { line-height: 20px; } .cultural_center .btns .btn { width: 190px; height: 60px; background: #333; color: #fff; border-radius: 5px; border: none; font-size: 17px; font-weight: 600; } .cultural_center .btns .btn:hover, .cultural_center .btns .btn:active { background: #000; } @media screen and (max-width: 1024px){ .cultural_center .multi_room { display: block; margin-bottom: 50px; overflow: hidden; } .cultural_center .multi_room .img_box { width: 90%; max-width: 590px; margin: 20px auto 50px; } .cultural_center .multi_room .txt_box { width: 90%; margin: 0 auto; } .cultural_center .multi_room .txt_box h3 { text-align: center; } .cultural_center .multi_room .txt_box ul li .name { width: 100px; } .cultural_center .multi_room .txt_box ul li .text { width: calc(100% - 100px); } .cultural_center .btns .btn { width: 150px; height: 50px; font-size: 16px; font-weight: 600; } } .multi_room_detail h3 { font-size: 30px; padding: 20px 0 30px; text-align: center; color: #000; font-weight: bold; } .multi_room_detail .multi_room .txt_box { width: 100%; } .multi_room_detail .img_box { max-width: 410px; width: 80%; margin: 0 auto; border: 1px solid #d1d1db; margin-bottom: 80px; } .multi_room_detail .img_box img { width: 100%; } .sub_title { font-size: 32px; font-weight: bold; color: #000; text-align: center; } @media screen and (max-width: 1024px){ .sub_title { font-size: 25px; } } /* 25.05.29. 사용자 신청화면 (둘러보기-생활문화센터-홍보신청하기) */ .apply_form { width: 100%; border: 0; border-collapse: collapse; border-top: 2px solid #595f6b; box-sizing: border-box; table-layout: fixed; letter-spacing: -0.2px; background-color: #fff; margin-top: 30px; } table.apply_form th { color: #000; font-weight: 600; border-bottom: 1px solid #ddd; border-width: 0 0 1px 1px; text-align: center; font-size: 19px; vertical-align: middle; padding: 20px 10px; } table.apply_form td { text-align: left; padding: 20px 10px; border-bottom: 1px solid #ddd; border-width: 0 0 1px 1px; vertical-align: middle; } /*table.apply_form td input[type="text"] { width: 80%; height: 35px; padding: 20px 10px; border: 1px solid #dcdbdb; font-size: 17px; } 익스플로러에서 텍스트가 안보이는 문제로 height 삭제를 위해 주석처리 */ table.apply_form td input[type="text"] { width: 80%; padding: 20px 10px; border: 1px solid #dcdbdb; font-size: 17px; } table.apply_form td input[name="lccPeriodSt"], table.apply_form td input[name="lccPeriodEd"] { width: 160px; } @media screen and (max-width: 1024px) { table.apply_form th { font-size: 16px; padding: 15px 5px; } table.apply_form td { padding: 15px 10px; } table.apply_form td input[type="text"] { width: 100%; font-size: 14px; padding: 10px; } table.apply_form td input[name="lccPeriodSt"], table.apply_form td input[name="lccPeriodEd"] { width: 100px; } } .cultural_center .add_btn { display: flex; justify-content: flex-end; } .cultural_center .add_btn>.btn { width: 190px; height: 60px; background: #333; color: #fff; border-radius: 5px; border: none; font-size: 17px; font-weight: 600; float: right; margin-top: 70px; gap: 3px; } /** 생활문화센터 바로가기 버튼 **/ .cultural_center_go_button { display: flex; justify-content: flex-end; align-items: center; } .cultural_center_go_button a { background-color: #00b298; color: white; border-radius: 25px; text-decoration: none; padding: 10px 45px; } /* 25.06.02 생활문화센터(지난행사 상세) 슬라이드 수정 */ .event_swiper .swiper-container { position: relative; /* 필수 */ overflow: hidden; width: 100%; } .event_swiper .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; } .event_swiper .swiper-slide img { width: 100%; height: auto; max-width: 640px; } .event_swiper .swiper-wrapper { margin-top: 0; width: 100%; height: 50%; } .event_swiper .swiper-button-next:after, .event_swiper .swiper-button-prev:after { display: none; } .event_swiper .swiper-button-prev, .event_swiper .swiper-button-next { background: none !important; width: auto !important; height: auto !important; } /* 왼쪽 버튼 */ .event_swiper .swiper-button-prev { left: 100px; } /* 오른쪽 버튼 */ .event_swiper .swiper-button-next { right: 100px; } @media all and (max-width: 900px) { .event_swiper .swiper-button-prev img, .event_swiper .swiper-button-next img { max-width: 50px; } } @media all and (max-width: 600px) { .event_swiper .swiper-button-prev img, .event_swiper .swiper-button-next img { max-width: 40px; } } /* 생활문화센터 */ .Living_Culture_Center { position: relative; } .Living_Culture_Center>a { display: inline-block; } .Living_Culture_Center .information { position: absolute; right: 10px; bottom: 10px; width: 20%; } .Living_Culture_Center .floor_1 { position: absolute; left: 10%; bottom: 10%; width: 20%; } .Living_Culture_Center .floor_2 { position: absolute; left: 10%; bottom: 40%; width: 20%; } .Living_Culture_Center .bg { width: 100%; } @media all and (max-width: 1420px){ .Living_Culture_Center .information { width: 20%; } .Living_Culture_Center .floor_1 { width: 25%; } .Living_Culture_Center .floor_2 { width: 25%; } } @media all and (max-width: 1024px){ .Living_Culture_Center .information { width: 25%; } .Living_Culture_Center .floor_1 { width: 35%; } .Living_Culture_Center .floor_2 { width: 35%; } } @media all and (max-width: 600px){ .Living_Culture_Center { display: flex; flex-direction: row; flex-wrap: wrap; } .Living_Culture_Center>a { width: 50%; } .Living_Culture_Center>a:nth-child(1) { order: 2; } .Living_Culture_Center>a:nth-child(2) { order: 1; } .Living_Culture_Center .information { width: 35%; } .Living_Culture_Center .floor_1 { position: unset; width: 100%; order: 1; } .Living_Culture_Center .floor_2 { position: unset; width: 100%; order: 2; } } .Living_Culture_Center_info { display: flex; margin: 5% auto; justify-content: space-between; } .Living_Culture_Center_info .box { background-color: #f6f6f6; border-radius: 20px; width: 23.5%; max-width: 20rem; padding-bottom: 6%; position: relative; } .Living_Culture_Center_info .box:not(:last-child) { gap: 2%; } .Living_Culture_Center_info .box .tit { display: flex; margin: 6% 5% 0 5%; justify-content: space-between; align-items: center; padding-left: 5%; font-size: calc(12px + 0.625vw); font-weight: 600; color: #333; height: 3vw; } .Living_Culture_Center_info .box .tit span { background-color: #fff; border-radius: 20px; display: flex; font-size: calc(12px + 0.9375vw); font-weight: 900; color: #333; justify-content: center; padding: 5%; } .Living_Culture_Center_info .box .list { padding-left: 10%; display: block; } .Living_Culture_Center_info .list li { line-height: 150%; font-size: calc(12px + 0.2083vw); } .Living_Culture_Center_info .list li::before { display: inline-block; content: '·'; margin-right: 2%; } .Living_Culture_Center_info .icon_info { position: absolute; bottom: 10%; right: 10%; } .Living_Culture_Center_info .icon_info ul { display: flex; column-gap: 15%; justify-content: flex-end; } .Living_Culture_Center_info .icon_info li { display: flex; align-items: center; } .Living_Culture_Center_info .icon_info li img { } @media all and (max-width: 1280px){ .Living_Culture_Center_info { flex-wrap: wrap; row-gap: 2vw; } .Living_Culture_Center_info .box { /*width: 49%; */ max-width: unset; } .Living_Culture_Center_info .box .tit { display: flex; margin: 5% 5% 0 5%; padding-left: unset; height: 5vw; } .Living_Culture_Center_info .box .list { padding-left: 5%; } .Living_Culture_Center_info .box .list li { line-height: 150%; } } @media all and (max-width: 900px) { } @media all and (max-width: 600px){ .Living_Culture_Center_info { row-gap: 3vw; } .Living_Culture_Center_info .box { width: 100%; padding-bottom: 5%; border-radius: 15px; } .Living_Culture_Center_info .box .tit { display: flex; margin: 2% 5% 0 5%; height: 14vw; font-size: 20px; } .Living_Culture_Center_info .box .list li { font-size: 16px; } .Living_Culture_Center_info .icon_info li img { width: 27px; } } .Living_Culture_Center_event { padding: 3% 2% 0 2%; } .Living_Culture_Center_event .tit { border-bottom: 4px solid #222; padding-bottom: 3%; margin-bottom: 3%; line-height: 150%; } .Living_Culture_Center_event .tit p { font-size: calc(16px + 1.0417vw); color: #333; text-align: center; font-weight: 700; } .Living_Culture_Center_event .list { display: flex; justify-content: center; } .Living_Culture_Center_event .list ul { } .Living_Culture_Center_event .list ul li { color: #333; font-size: .9375vw; font-size: calc(14px + 0.2083vw); line-height: 150%; padding-left: 20px; } .Living_Culture_Center_event .list ul li::before { display: inline-block; content: '·'; margin-right: 10px; margin-left: -16px; } @media (max-width: 600px){ .Living_Culture_Center_event .list ul li { font-size: 16px; } } /* 25.09.09 생활문화센터 수정 */ .btnBlank { padding: 2% 4%; } .btnBasic a { background: #fff; border: 1px solid #ccc; padding: 2% 4%; border-radius: 5px; display: inline-block; } .box.f1 { display: flex; width: 53%; max-width: 40rem; } .floorInfo { width: 50%; } @media (max-width: 1280px){ .box.f1 { width: 48%; } } @media (max-width: 600px){ .box.f1 { width: 100%; flex-wrap: wrap; padding-bottom: 15%; } .box.f1 .floorInfo { width: 100%; } .Living_Culture_Center_info .icon_info { bottom: 5%; } }