[data-catagory=event] .templ-type-title { margin-bottom: 65px} [data-catagory=event] .templ-type-tab-medium+.inner-type-basic { margin-top: 60px} @media screen and (max-width: 768px) { [data-catagory=event] .templ-type-tab-medium~.search-filter, [data-catagory=event] .templ-type-tab-medium~*>.search-filter { margin-top: 40px} } [data-catagory=event] .search-filter { margin: 40px 0 46px} [data-catagory=event] .search-filter>ul>li.det4 .fieldset { width: calc(100% - 210px)} @media screen and (max-width: 768px) { [data-catagory=event] .search-filter { margin: -30px -20px 25px} [data-catagory=event] .search-filter>ul>li.det4 .fieldset { width: calc(100% - 75px)} [data-catagory=event] .search-filter>ul>li .fieldset .checkbox-box { margin-right: 0} [data-catagory=event] .search-filter>ul>li .fieldset .checkbox-box [type=checkbox]+label { margin-left: 0} [data-catagory=event] .search-filter>ul>li.event-sort { width: 10%} [data-catagory=event] .search-filter>ul>li.branch { width: 16%} [data-catagory=event] .search-filter>ul>li.document { width: 61%} [data-catagory=event] .search-filter>ul>li.date { width: 16%} } [data-catagory=event] .search-filter .list-contents ul li span.num { width: 7%} [data-catagory=event] .search-filter .list-contents ul li span.event-sort { width: 10%} [data-catagory=event] .search-filter .list-contents ul li span.branch { width: 16%} [data-catagory=event] .search-filter .list-contents ul li span.document { width: 61%} [data-catagory=event] .search-filter .list-contents ul li span.date { width: 16%} @media screen and (max-width: 768px) { [data-catagory=event] .search-filter .list-contents ul li span.event-sort { display: inline-block; width: auto} [data-catagory=event] .search-filter .list-contents ul li span.event-sort:after { content: ""; margin: -2px 10px 0; display: inline-block; width: 1px; height: 16px; vertical-align: middle; background-color: #ddd} [data-catagory=event] .search-filter .list-contents ul li span.branch { display: inline-block; width: auto} [data-catagory=event] .search-filter .list-contents ul li span.document, [data-catagory=event] .search-filter .list-contents ul li span.date { width: 100%} } [data-catagory=event] .detail-area .detail-title span.event-sort, [data-catagory=event] .detail-area .detail-title span.branch { display: inline-block; color: #555} [data-catagory=event] .detail-area .detail-title span.branch:before { display: inline-block; width: 1px; height: 16px; margin: 0 9px 0 8px; background-color: #ddd; vertical-align: -2px; content: ""} @media screen and (max-width: 768px) { [data-catagory=event] .detail-area .detail-title span.branch:before { height: 12.5px; margin: 0 7px 0 6px; vertical-align: -1px} } .event-list-wrap .no-data-box { border-top: none; margin-top: 0} @media screen and (max-width: 768px){ .event-list-wrap .no-data-box { border: 1px solid #ddd} } .event-list-sort { margin-bottom: 16px} .event-list-sort:after { content: ""; display: block; clear: both} .event-list-sort .total-count { display: inline-block; padding-top: 13px; font-size: 18px; line-height: 18px} .event-list-sort .total-count strong { font-weight: 700; color: #da291c} .event-list-sort .select-box { float: right; width: 120px} .event-list-sort .select-box em { border-bottom-width: 1px} @media screen and (max-width: 768px){ .event-list-sort { margin-bottom: 20px} .event-list-sort .total-count { padding-top: 10px; font-size: 15px; line-height: 15px} .event-list-sort .total-count strong { font-size: inherit; line-height: inherit} .event-list-sort .select-box { width: 90px} } .event-list { margin: 0 -15px} .event-list:after { content: ""; display: block; clear: both} .event-list>li { position: relative; float: left; width: 33.333%; padding: 0 15px 50px} .event-list>li>a { display: block} .event-list>li:nth-child(3n+1) { clear: left} @media screen and (max-width: 1024px){ .event-list>li { width: 50%} .event-list>li:nth-child(3n+1) { clear: none} .event-list>li:nth-child(2n+1) { clear: left} } @media screen and (max-width: 768px){ .event-list { margin: 0} .event-list>li { float: none; width: 100%; padding: 0 0 50px} .event-list>li:last-child { padding-bottom: 10px} } .event-list .event-badge { position: absolute; top: 0; left: 15px; max-width: 406px; z-index: 1} .event-list .event-badge:after { content: ""; display: block; clear: both} .event-list .event-badge span { float: left; margin-left: 1px; padding: 0 10px; background-color: rgba(0, 0, 0, .5); border-top: none; font-size: 13px; line-height: 46px; color: #fff} .event-list .event-badge span:first-child { margin-left: 0} .event-list .event-badge .pictogram-box { margin-left: 1px; display: inline-block; font-size: 0; line-height: 1; vertical-align: top} .event-list .event-badge .pictogram-box .ico-picoto-nor { padding: 0; display: inline-block; width: 51px; height: 46px; background: rgba(0, 0, 0, .5)} .event-list .event-badge .pictogram-box .ico-picoto-nor img { width: 100%} .event-list .event-badge .pictogram-box .ico-picoto-nor+span { margin-left: 1px} @media screen and (max-width: 768px){ .event-list .event-badge { left: 0} .event-list .event-badge span { padding: 0 10px; line-height: 35px} .event-list .event-badge .pictogram-box { margin-left: 1px; display: inline-block; font-size: 0; line-height: 1; vertical-align: top} .event-list .event-badge .pictogram-box .ico-picoto-nor { padding: 0; width: 38px; height: 35px; background: rgba(0, 0, 0, .5)} } .event-list .event-thumbnail { position: relative; overflow: hidden; width: 100%; padding-bottom: 63.6%} .event-list .event-thumbnail>a { display: block} .event-list .event-thumbnail>a>span { display: block} .event-list .event-thumbnail>a>span img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all .3s ease-out} .event-list .event-thumbnail>a:hover img { transform: scale(1.1); transition: all .3s ease-out} @media screen and (max-width: 768px){ .event-list .event-thumbnail>a:hover img { transform: none; transition: none} } .event-list .event-info { position: relative; padding: 30px 20px 0} .event-list .event-info .title { display: block; margin-bottom: 20px; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; font-weight: 700; font-size: 22px; line-height: 1.6} .event-list .event-info .hash-tags { height: 36px; margin-top: 9px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 14px; line-height: 18px; color: #777} .event-list .event-info .price-box { display: block; text-align: right; padding-top: 10px; border-top: 1px #ddd solid; margin-top: 20px; font-size: 0} .event-list .event-info .price-box .dutch-price { margin-right: 15px; color: #777} .event-list .event-info .price-box .price { color: #da291c; font-size: 22px; line-height: 22px; font-weight: bold} @media screen and (max-width: 768px){ .event-list .event-info .title { margin-bottom: 12px; font-size: 18px; line-height: 18px; line-height: 1.4} .event-list .event-info .date { font-size: 14px; line-height: 14px} .event-list .event-info .hash-tags { margin-top: 6px; font-size: 11px; line-height: 14px; height: auto} .event-list .event-info .price-box { padding-top: 15px; margin: 15px -20px 0} .event-list .event-info .price-box .price { font-size: 20px; line-height: 20px} } .event-flag { position: absolute; top: -15px; left: 12px; display: inline-block; padding: 6px 10px; border-radius: 0 3px 3px 0; background-color: #da291c; transform: skewX(-20deg)} .event-flag:before { position: absolute; top: 0; left: 0; width: 1px; height: 46px; background-color: #da291c; content: ""} .event-flag span { display: block; font-size: 13px; color: #fff; transform: skewX(20deg)} @media screen and (max-width: 768px){ .event-flag { top: -12px; left: 9px; padding: 5px 10px} .event-flag:before { height: 37px} } .list-more { text-align: center} .list-more .button-small { min-width: 140px; padding: 15px 30px} .list-more .button-small em { position: relative; padding-right: 21px} .list-more .button-small em:before, .list-more .button-small em:after { position: absolute; top: 7px; right: 5px; width: 1px; height: 11px; background-color: #777; content: ""} .list-more .button-small em:after { transform: rotate(90deg)} @media screen and (max-width: 768px){ .list-more .button-small { width: 100px; padding: 8.5px 0} .list-more .button-small em:before, .list-more .button-small em:after { top: 5px} } .badge-time-sale { position: absolute; top: 68px; left: calc(50% - 57px); width: 114px; height: 114px; border-radius: 100px; background-color: rgba(51, 174, 182, .85); text-align: center} .badge-time-sale .icon-alarm { margin: 30px auto 10px} .badge-time-sale .text { font-size: 18px; line-height: 18px; color: #fff} @media screen and (max-width: 768px){ .badge-time-sale { top: 63px; left: calc(50% - 40px); width: 80px; height: 80px} .badge-time-sale .icon-alarm { margin: 18.5px auto 7.5px} .badge-time-sale .text { font-size: 13px} } .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio { position: relative; display: inline-block; margin-right: 20px} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio+label { display: inline-block; color: #666; position: relative; padding-left: 20px; height: 18px; cursor: pointer; font-size: 16px} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio+label:before { display: block; content: ""; position: absolute; left: 0; top: 0; width: 16px; height: 16px; text-align: center; background: #fff; border: 1px solid #b0b0b0; border-radius: 100%} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio:checked+label { color: #666} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio:checked+label:before { background: #fff; border: 1px solid #ccc} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio:checked+label:after { content: ""; position: absolute; top: 4px; left: 4px; width: 8px; height: 8px; background: #da291c; border-radius: 100%} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio[disabled]+label:before { opacity: .3} .content-wrap.group-event.recruit-area .tb-event.recruit-page label.radio-txt { color: #666} .content-wrap.group-event.recruit-area .tb-event.recruit-page tr td:nth-child(2) { width: auto} @media screen and (max-width: 768px){ .content-wrap.group-event.recruit-area .content { padding: 0 1rem} .content-wrap.group-event.recruit-area .tb-event.recruit-page .radio-wrap { display: flex; justify-content: space-between} .content-wrap.group-event.recruit-area .tb-event.recruit-page .radio-wrap .custom-radio { margin-right: 5px} .content-wrap.group-event.recruit-area .tb-event.recruit-page .custom-radio .radio+label { font-size: 12px} .content-wrap.group-event.recruit-area .tb-event.recruit-page tr td:nth-child(2) { width: 100%} } [data-catagory=index] .container .panel.package .event-thumbnail img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover} [data-catagory=support] .templ-type-title { margin-bottom: 65px} [data-catagory=support] .templ-type-tab-medium { margin-bottom: 50px} @media screen and (max-width: 768px) { [data-catagory=support] .templ-type-tab-medium { margin-bottom: 20px} } [data-catagory=support] .templ-type-infolist-1 { margin-top: 30px} [data-catagory=support] .result-box { margin-bottom: 40px; border-top: 2px solid #555} [data-catagory=support] .result-box .top { padding: 20px 40px} [data-catagory=support] .result-box .top:after { content: ""; display: block; clear: both} [data-catagory=support] .result-box .top ul { float: left; width: 33.33334%} [data-catagory=support] .result-box .top ul li { padding: 5px 0} [data-catagory=support] .result-box .top ul li:after { content: ""; display: block; clear: both} [data-catagory=support] .result-box .top ul li .title { float: left; line-height: 26px; color: #777} [data-catagory=support] .result-box .top ul li .text { font-size: 18px; line-height: 18px; display: block; padding-left: 45px; line-height: 26px; font-weight: bold; word-break: break-word} [data-catagory=support] .result-box .top ul:last-child li .text { padding-left: 105px} @media screen and (max-width: 768px) { [data-catagory=support] .result-box .top ul:last-child li .text { padding-left: 95px} } @media screen and (max-width: 1024px) { [data-catagory=support] .result-box .top { padding: 20px} } @media screen and (max-width: 768px) { [data-catagory=support] .result-box .top ul { width: 100%} [data-catagory=support] .result-box .top ul li { padding: 3px 0} [data-catagory=support] .result-box .top ul li .title { line-height: 24px} [data-catagory=support] .result-box .top ul li .text { font-size: 15px; padding-left: 95px; line-height: 24px} } [data-catagory=support] .result-box .bottom { padding: 20px 40px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; background-color: #f5f5f5} [data-catagory=support] .result-box .bottom:after { content: ""; display: block; clear: both} [data-catagory=support] .result-box .bottom li { padding: 5px 0} [data-catagory=support] .result-box .bottom li:after { content: ""; display: block; clear: both} [data-catagory=support] .result-box .bottom li .title { position: relative; float: left; line-height: 26px; color: #777} [data-catagory=support] .result-box .bottom li .title:before { content: ""; display: inline-block; margin-right: 6px; width: 3px; height: 3px; vertical-align: 5px; border-radius: 50%; background-color: #777} [data-catagory=support] .result-box .bottom li .text { display: block; padding-left: 95px; line-height: 26px} [data-catagory=support] .result-box .bottom li .text .btn-file { padding: 0; font-size: 16px; line-height: 16px; line-height: 26px; color: #777; vertical-align: top} @media screen and (max-width: 768px) { [data-catagory=support] .result-box .bottom li .text .btn-file { font-size: 14px; line-height: 14px} } @media screen and (max-width: 768px) { [data-catagory=support] .result-box .bottom { padding: 20px} [data-catagory=support] .result-box .bottom li { padding: 3px 0} [data-catagory=support] .result-box .bottom li .title { line-height: 24px} [data-catagory=support] .result-box .bottom li .text { line-height: 24px} [data-catagory=support] .result-box .bottom li .text .btn-file { line-height: 24px} } @media screen and (max-width: 768px) { [data-catagory=support] .result-box { margin-bottom: 20px} } [data-catagory=support] .select-wrap { width: 90px} [data-catagory=support] .agree-list.border li .checkbox-box label em { font-weight: bold} [data-catagory=support] .agree-list.border li .checkbox-box label em .text-red { font-weight: bold} [data-catagory=support] .agree-list.border li .btn-link { float: none; margin-left: 10px; vertical-align: -1px} @media screen and (max-width: 768px) { [data-catagory=support] .agree-list.border li .btn-link { margin: 0; float: right} } [data-catagory=support] .complete-box { padding-bottom: 0; border: none} [data-catagory=support] .text-right { margin-bottom: -10px; text-align: right; color: #777} [data-catagory=support] .text-right .text-red { color: #da291c} @media screen and (max-width: 768px) { [data-catagory=support] .text-right { margin-bottom: 0} } @media screen and (max-width: 768px) { [data-catagory=support] .templ-type-title { display: none} } [data-catagory=support] .search-box.top .search-inner { display: table; margin: auto} [data-catagory=support] .search-box.top .search-inner .select-wrap { display: table-cell; padding-right: 20px; width: 140px; vertical-align: bottom} @media screen and (max-width: 768px) { [data-catagory=support] .search-box.top .search-inner .select-wrap { width: 100px} } [data-catagory=support] .search-box.top .search-inner .select-wrap .select-box em { text-align: left} .search-box { margin-bottom: 77px; padding: 30px 0; text-align: center; background-color: #f5f5f5} @media screen and (max-width: 768px){ .search-box.top { margin-top: -30px} } .search-box .search-inner .select-box-wrap, .search-box .search-inner .input-box, .search-box .search-inner .btn-box { display: inline-block; vertical-align: bottom} .search-box .search-inner .select-box-wrap { width: 120px; padding-right: 17px; text-align: left} .search-box .search-inner .input-box { width: 452px} .search-box .search-inner .btn-box { padding-left: 17px; width: auto; white-space: nowrap; vertical-align: top} .search-box .search-inner .btn-box button { width: auto} @media screen and (max-width: 768px){ .search-box .search-inner { display: table; width: 100%} .search-box .search-inner .select-box-wrap, .search-box .search-inner .input-box, .search-box .search-inner .btn-box { display: table-cell} .search-box .search-inner .select-box-wrap { width: 80px} .search-box .search-inner .select-box-wrap .select-box em { border-bottom-width: 1px} .search-box .search-inner .input-box { width: auto} .search-box .search-inner .btn-box { padding-left: 10px; width: 75px} } .search-box .search-filter { margin: 0 auto; padding: 0; border: none} .search-box .search-filter .form-wrap { display: inline-block; vertical-align: middle} .search-box .search-filter .form-wrap:after { content: ""; display: block; clear: both} .search-box .search-filter .form-wrap>label, .search-box .search-filter .form-wrap>.label { float: left; margin: 0; padding: 9px 0; width: auto; color: #555; font-size: 16px; line-height: 16px} @media screen and (max-width: 768px){ .search-box .search-filter .form-wrap>label, .search-box .search-filter .form-wrap>.label { font-size: 14px; line-height: 14px} } .search-box .search-filter .form-wrap .fieldset { float: left; margin: 0 10px 0 15px; font-size: 0} .search-box .search-filter .form-wrap .fieldset .input-box.date-picker { width: 140px} .search-box .search-filter .form-wrap .radio-monthly { float: left; padding: 9px 0} .search-box .search-filter .form-wrap .radio-monthly ul:after { content: ""; display: block; clear: both} .search-box .search-filter .form-wrap .radio-monthly ul li { float: left; border-right: 1px #ddd solid} .search-box .search-filter .form-wrap .radio-monthly ul li:last-child { border-right: none} .search-box .search-filter .form-wrap .radio-monthly ul li [type=radio] { opacity: 0; outline: none; position: absolute; margin: 0; width: 0; height: 0; z-index: -1} .search-box .search-filter .form-wrap .radio-monthly ul li [type=radio]+label { display: block; margin: 0} .search-box .search-filter .form-wrap .radio-monthly ul li [type=radio]+label em { display: block; color: #555; font-size: 14px; line-height: 14px; cursor: pointer; position: relative; padding: 0 10px} .search-box .search-filter .form-wrap .radio-monthly ul li [type=radio]:checked+label em { font-weight: bold} .search-box .search-filter .btn-box { display: inline-block; vertical-align: middle} .search-box+.templ-type-tab-small { margin-top: -20px} .search-box~.select-wrap { margin-top: -37px} .search-box+.templ-type-tab-button { margin-top: -17px} @media screen and (max-width: 768px){ .search-box { margin: 0 -20px 67px; padding: 30px 20px} .search-box+.templ-type-tab-button { margin-top: -41px} .search-box .search-filter .form-wrap { padding-left: 70px} .search-box .search-filter .form-wrap>label, .search-box .search-filter .form-wrap>.label { position: absolute; top: 0; left: 0} .search-box .search-filter .form-wrap .fieldset { margin: 0; width: 100%} .search-box .search-filter .form-wrap .fieldset .input-box.date-picker { width: calc(50% - 15px)} .search-box .search-filter .form-wrap .fieldset .trem { width: 30px} .search-box .search-filter .form-wrap .radio-monthly { margin: 10px 0 0 -10px} .search-box .search-filter .btn-box { position: absolute; right: 0; bottom: -10px} } .list-area { position: relative; margin-top: 30px; border-top: 2px solid #555} .list-area .total { position: absolute; top: -40px; right: 0; color: #555} .list-area .total strong { color: #000; font-weight: bold} .list-area .total.type-left-point { left: 0; font-size: 18px; line-height: 18px; color: #777} .list-area .total.type-left-point strong { color: #da291c} .list-area .list-header { border-bottom: 1px solid #ddd} .list-area .list-header ul { display: table; table-layout: fixed; width: 100%; padding: 22px 0; font-size: 0; line-height: normal} .list-area .list-header ul li { display: table-cell; text-align: center; font-weight: bold; border-left: 1px solid #eee} .list-area .list-header ul li:first-child { border-left: none} .list-area .list-header ul li.num { width: 7%} .list-area .list-header ul li.branch { width: 12%} .list-area .list-header ul li.document { width: 68%} .list-area .list-header ul li.date { width: 13%} .list-area .list-header ul li.file { width: 13%} .list-area .list-contents ul li { position: relative; display: table; table-layout: fixed; width: 100%; padding: 22px 0; line-height: normal; font-size: 0; border-bottom: 1px solid #ddd} .list-area .list-contents ul li.noti { background: #eaf7f8} .list-area .list-contents ul li.noti span.num { position: relative; text-indent: -9999px} .list-area .list-contents ul li.noti span.num:before { content: ""; display: block; position: absolute; top: 50%; left: 50%; width: 23px; height: 18px; background: url(../image/icon-notice.png) no-repeat; transform: translate(-50%, -50%)} .list-area .list-contents ul li a { display: table; table-layout: fixed; width: 100%; font-size: 0; line-height: 100%} .list-area .list-contents ul li span { display: table-cell; color: #555; text-align: center; vertical-align: middle} .list-area .list-contents ul li span.num { width: 7%} .list-area .list-contents ul li span.branch { width: 12%} .list-area .list-contents ul li span.document { padding: 0 30px; width: 68%; color: #000; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden} .list-area .list-contents ul li span.document .keyword { display: inline-block; color: #33aeb6; font-weight: bold} .list-area .list-contents ul li span.date { width: 13%} .list-area .list-contents ul li span.file { width: 13%} .list-area .list-contents ul li span.file .down { position: relative; font-size: 16px; line-height: 16px; padding: 10px 25px; width: auto} @media screen and (max-width: 768px){ .list-area .list-contents ul li span.file .down { font-size: 14px; line-height: 14px} } @media screen and (max-width: 1024px){ .list-area .list-contents ul li span.file .down em { display: none} } .list-area .list-contents ul li span.file .down:after { content: ""; background-image: url("data:image/svg+xml; charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16.5px' height='17px'%3e%3cpath fill-rule='evenodd' stroke='rgb(0, 0, 0)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='none' d='M0.500,12.000 L0.500,16.000 L15.500,16.000 L15.500,12.000 '/%3e%3cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M7.500,-0.000 L8.500,-0.000 L8.500,12.000 L7.500,12.000 L7.500,-0.000 Z'/%3e%3cpath fill-rule='evenodd' stroke='rgb(0, 0, 0)' stroke-width='1px' stroke-linecap='round' stroke-linejoin='round' fill='none' d='M4.404,7.154 L7.990,10.690 L11.575,7.154 '/%3e%3c/svg%3e"); background-size: 100% 100%; display: inline-block; margin: -4px 0 0 6px; width: 16.5px; height: 17px; vertical-align: middle; z-index: 1} @media screen and (max-width: 1024px){ .list-area .list-contents ul li span.file .down:after { margin: -4px 0 0 0} } .list-area .list-contents ul li span.file .down:hover { border: 1px solid #33aeb6; background-color: #33aeb6; transition: all cubic-bezier(0.65, 0.05, 0.36, 0.5) .2s} .list-area .list-contents ul li span.file .down:hover em { color: #fff} .list-area .list-contents ul li span.file .down:hover:after { background-image: url("data:image/svg+xml; charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16.5px' height='17px'%3e%3cpath fill-rule='evenodd' stroke='rgb(255, 255, 255)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='none' d='M0.500,12.000 L0.500,16.000 L15.500,16.000 L15.500,12.000 '/%3e%3cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M7.500,-0.000 L8.500,-0.000 L8.500,12.000 L7.500,12.000 L7.500,-0.000 Z'/%3e%3cpath fill-rule='evenodd' stroke='rgb(255, 255, 255)' stroke-width='1px' stroke-linecap='round' stroke-linejoin='round' fill='none' d='M4.404,7.154 L7.990,10.690 L11.575,7.154 '/%3e%3c/svg%3e")} .list-area .list-contents.btn ul li { padding: 10px 0} @media screen and (max-width: 768px){ .list-area .list-contents.btn ul li { padding: 20px} } .list-area .list-contents.notice ul li a.winnerC { position: absolute; display: inline-block; width: 130px; right: 25px; top: 10px; text-align: center; vertical-align: middle; font-size: 16px; padding: 20px 0} .list-area .list-contents.notice ul li a.winnerC:after { display: inline-block; width: 30px; height: 30px; margin-left: 11px; border-radius: 100px; background: #eee url(../image/icon-search.png) no-repeat 50% 50%; background-size: 16px 16px; vertical-align: -8px; content: ""} @media screen and (max-width: 768px){ .list-area .list-contents.notice ul li a.winnerC { position: static; font-size: 14px; padding: 0; text-align: left} .list-area .list-contents.notice ul li a.winnerC .mobile-view { display: inline !important} .list-area .list-contents.notice ul li a.winnerC:after { display: none} } .list-area.coupon-buy { margin-top: 80px} .list-area.coupon-buy .list-header ul li.num { width: 6%} .list-area.coupon-buy .list-header ul li.number { width: 15%} .list-area.coupon-buy .list-header ul li.branch { width: 15%} .list-area.coupon-buy .list-header ul li.name { width: 31%} .list-area.coupon-buy .list-header ul li.amount { width: 11%} .list-area.coupon-buy .list-header ul li.date { width: 11%} .list-area.coupon-buy .list-header ul li.state { width: 11%} .list-area.coupon-buy .list-contents ul li { padding: 0} .list-area.coupon-buy .list-contents ul li span a.link-btn { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.coupon-buy .list-contents ul li span a.link-btn { font-size: 14px; line-height: 14px} } .list-area.coupon-buy .list-contents ul li span.num { width: 6%} .list-area.coupon-buy .list-contents ul li span.number { width: 15%} .list-area.coupon-buy .list-contents ul li span.branch { width: 15%} .list-area.coupon-buy .list-contents ul li span.name { width: 31%; padding: 0 30px; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden} .list-area.coupon-buy .list-contents ul li span.amount { width: 11%} .list-area.coupon-buy .list-contents ul li span.date { width: 11%} .list-area.coupon-buy .list-contents ul li span.state { width: 11%} .list-area.coupon-buy .list-contents ul li span.state em.text-red { color: #da291c} .list-area.coupon-buy .list-contents ul li .link-btn { padding: 22px 0} @media screen and (max-width: 768px){ .list-area.coupon-buy .list-contents ul li .link-btn { padding: 22px} } .list-area.coupon-buy .list-contents ul li .link-btn .number { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.coupon-buy .list-contents ul li .link-btn .number { font-size: 14px; line-height: 14px} } .list-area.golf-reservation { margin-top: 80px} .list-area.golf-reservation .list-header ul li.num { width: 6%} .list-area.golf-reservation .list-header ul li.number { width: 12%} .list-area.golf-reservation .list-header ul li.type { width: 14%} .list-area.golf-reservation .list-header ul li.name { width: 12%} .list-area.golf-reservation .list-header ul li.branch { width: 10%} .list-area.golf-reservation .list-header ul li.course { width: 14%} .list-area.golf-reservation .list-header ul li.date { width: 19%} .list-area.golf-reservation .list-header ul li.date2 { width: 16%} .list-area.golf-reservation .list-header ul li.state { width: 11%} .list-area.golf-reservation .list-contents ul li { padding: 0} .list-area.golf-reservation .list-contents ul li span { line-height: 150%} .list-area.golf-reservation .list-contents ul li span a.link-btn { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.golf-reservation .list-contents ul li span a.link-btn { font-size: 14px; line-height: 14px} } .list-area.golf-reservation .list-contents ul li span.num { width: 6%} .list-area.golf-reservation .list-contents ul li span.number { width: 12%} .list-area.golf-reservation .list-contents ul li span.type { width: 14%} .list-area.golf-reservation .list-contents ul li span.name { width: 12%} .list-area.golf-reservation .list-contents ul li span.branch { width: 10%} .list-area.golf-reservation .list-contents ul li span.course { width: 14%} .list-area.golf-reservation .list-contents ul li span.course em { display: block; line-height: 1.5} @media screen and (max-width: 768px){ .list-area.golf-reservation .list-contents ul li span.course .mobile-view { display: inline !important} } .list-area.golf-reservation .list-contents ul li span.date { width: 19%} .list-area.golf-reservation .list-contents ul li span.date em { display: block; line-height: 1.5} .list-area.golf-reservation .list-contents ul li span.date2 { width: 16%} .list-area.golf-reservation .list-contents ul li span.state { width: 11%} .list-area.golf-reservation .list-contents ul li span.state em { display: block; color: #555; line-height: 1.5} .list-area.golf-reservation .list-contents ul li span.state em.text-red { color: #da291c} .list-area.golf-reservation .list-contents ul li .link-btn { padding: 22px 0} @media screen and (max-width: 768px){ .list-area.golf-reservation .list-contents ul li .link-btn { padding: 22px} } .list-area.golf-reservation .list-contents ul li .link-btn .number { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.golf-reservation .list-contents ul li .link-btn .number { font-size: 14px; line-height: 14px} } .list-area.golf-reservation.type2 { margin-top: 80px} .list-area.golf-reservation.type2 .list-header ul li.num { width: 6%} .list-area.golf-reservation.type2 .list-header ul li.number { width: 11%} .list-area.golf-reservation.type2 .list-header ul li.recommend { width: 9%} .list-area.golf-reservation.type2 .list-header ul li.recommend2 { width: 9%} .list-area.golf-reservation.type2 .list-header ul li.type { width: 14%} .list-area.golf-reservation.type2 .list-header ul li.branch { width: 10%} .list-area.golf-reservation.type2 .list-header ul li.course { width: 12%} .list-area.golf-reservation.type2 .list-header ul li.date { width: 17%} .list-area.golf-reservation.type2 .list-header ul li.date2 { width: 14%} .list-area.golf-reservation.type2 .list-header ul li.state { width: 10%} .list-area.golf-reservation.type2 .list-contents ul li span a.link-btn { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.golf-reservation.type2 .list-contents ul li span a.link-btn { font-size: 14px; line-height: 14px} } .list-area.golf-reservation.type2 .list-contents ul li span.num { width: 6%} .list-area.golf-reservation.type2 .list-contents ul li span.number { width: 11%} .list-area.golf-reservation.type2 .list-contents ul li span.recommend { width: 9%} .list-area.golf-reservation.type2 .list-contents ul li span.recommend2 { width: 9%} .list-area.golf-reservation.type2 .list-contents ul li span.type { width: 14%} .list-area.golf-reservation.type2 .list-contents ul li span.branch { width: 10%} .list-area.golf-reservation.type2 .list-contents ul li span.course { width: 12%} .list-area.golf-reservation.type2 .list-contents ul li span.date { width: 17%} .list-area.golf-reservation.type2 .list-contents ul li span.date2 { width: 14%} .list-area.golf-reservation.type2 .list-contents ul li span.state { width: 10%} .list-area.golf-reservation.type2 .list-contents ul li span.state em { color: #555} .list-area.golf-reservation.type2 .list-contents ul li span.state em.text-red { color: #da291c} .list-area.wait-reservation { margin-top: 80px} .list-area.wait-reservation .list-header ul li.num { width: 6%} .list-area.wait-reservation .list-header ul li.number { width: 12%} .list-area.wait-reservation .list-header ul li.branch { width: 10%} .list-area.wait-reservation .list-header ul li.course { width: 18%} .list-area.wait-reservation .list-header ul li.date { width: 23%} .list-area.wait-reservation .list-header ul li.date2 { width: 20%} .list-area.wait-reservation .list-header ul li.state { width: 11%} .list-area.wait-reservation .list-contents ul li { padding: 0} .list-area.wait-reservation .list-contents ul li span a.link-btn { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.wait-reservation .list-contents ul li span a.link-btn { font-size: 14px; line-height: 14px} } .list-area.wait-reservation .list-contents ul li span.num { width: 6%} .list-area.wait-reservation .list-contents ul li span.number { width: 12%} .list-area.wait-reservation .list-contents ul li span.branch { width: 10%} .list-area.wait-reservation .list-contents ul li span.course { width: 18%} .list-area.wait-reservation .list-contents ul li span.date { width: 23%} .list-area.wait-reservation .list-contents ul li span.date2 { width: 20%} .list-area.wait-reservation .list-contents ul li span.state { width: 11%} .list-area.wait-reservation .list-contents ul li span.state em.text-red { color: #da291c} .list-area.wait-reservation .list-contents ul li .link-btn { padding: 22px 0} .list-area.wait-reservation .list-contents ul li .link-btn .number { font-size: 16px; line-height: 16px; color: #33aeb6; font-weight: bold; text-decoration: underline} @media screen and (max-width: 768px){ .list-area.wait-reservation .list-contents ul li .link-btn .number { font-size: 14px; line-height: 14px} } .list-area.event-state { margin-top: 80px} .list-area.event-state .list-header ul li.title { width: 55%} .list-area.event-state .list-header ul li.date { width: 19%} .list-area.event-state .list-header ul li.date2 { width: 13%} .list-area.event-state .list-header ul li.date3 { width: 13%} .list-area.event-state .list-contents ul li span.title { width: 55%; padding: 0 25px; text-align: left; font-size: 0} .list-area.event-state .list-contents ul li span.title .state { display: inline-block; margin-right: 20px; padding: 7px 0; width: 70px; font-size: 14px; line-height: 14px; text-align: center; border-radius: 20px; border: 1px solid #ccc} .list-area.event-state .list-contents ul li span.title .state.ing { color: #da291c; border-color: #da291c} .list-area.event-state .list-contents ul li span.title .text { display: inline-block; max-width: calc(100% - 90px); color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden} .list-area.event-state .list-contents ul li span.date { width: 19%} .list-area.event-state .list-contents ul li span.date2 { width: 13%} .list-area.event-state .list-contents ul li span.date3 { width: 13%} .list-area.event-state .list-contents ul li span>span { display: inline-block; margin: 0} @media screen and (max-width: 768px){ .list-area { margin: 20px -20px 0; border-top: 1px solid #555} .list-area .total { right: 20px; top: -36px} .list-area .total.type-left-point { left: 20px; font-size: 15px; line-height: 15px} .list-area .list-header { display: none !important} .list-area .list-contents ul li { display: block; padding: 20px} .list-area .list-contents ul li span { display: block; text-align: left; margin: 5px 0} .list-area .list-contents ul li span.num { display: none} .list-area .list-contents ul li span.branch { width: 100%} .list-area .list-contents ul li span.document { padding: 0; width: 100%; font-size: 15px; font-weight: bold; line-height: 22px; white-space: normal; overflow: visible} .list-area .list-contents ul li span.document .keyword { font-size: 15px} .list-area .list-contents ul li span.date { width: 100%; margin-top: 10px} .list-area .list-contents ul li span.file { position: absolute; top: 50%; right: 20px; margin: 0; padding: 0; width: auto; transform: translateY(-50%)} .list-area .list-contents.btn ul li span.branch { padding-right: 90px} .list-area .list-contents.btn ul li span.document { padding: 0 90px 0 0} .list-area.coupon-buy { margin: 65px 0 0 0; border-top: none} .list-area.coupon-buy .total.type-left-point { left: 0} .list-area.coupon-buy .list-contents ul li { border: 1px solid #ddd; border-radius: 20px; margin-top: 30px; box-shadow: 0 8px 7px rgba(0, 0, 0, .1)} .list-area.coupon-buy .list-contents ul li:first-child { margin-top: 0} .list-area.coupon-buy .list-contents ul li span { text-align: left} .list-area.coupon-buy .list-contents ul li span.num { display: none} .list-area.coupon-buy .list-contents ul li span.number { display: inline-block; width: auto} .list-area.coupon-buy .list-contents ul li span.branch { display: block; margin-top: 15px; width: 100%; color: #000; font-size: 13px} .list-area.coupon-buy .list-contents ul li span.branch .mobile-view { display: none !important; font-size: 13px} .list-area.coupon-buy .list-contents ul li span.name { display: block; padding: 0; width: 100%; max-height: 40px; font-size: 16px; line-height: 20px; color: #000; font-weight: bold; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical} .list-area.coupon-buy .list-contents ul li span.amount { display: block; margin-top: 15px; width: 100%; font-size: 13px; color: #777} .list-area.coupon-buy .list-contents ul li span.amount .mobile-view { display: inline-block !important; font-size: 13px; color: #777} .list-area.coupon-buy .list-contents ul li span.date { display: block; margin-top: 5px; width: 100%; font-size: 13px; color: #777} .list-area.coupon-buy .list-contents ul li span.date .mobile-view { display: inline-block !important; font-size: 13px; color: #777} .list-area.coupon-buy .list-contents ul li span.state { position: absolute; top: 20px; left: 95px; display: inline-block; width: auto} .list-area.coupon-buy .list-contents ul li span.state:before { content: ""; display: inline-block; margin: -2px 10px 0 0; width: 1px; height: 12px; vertical-align: middle; background: #ddd} .list-area.golf-reservation { margin: 65px 0 0 0; border-top: none} .list-area.golf-reservation .total.type-left-point { left: 0} .list-area.golf-reservation .list-contents ul li { border: 1px solid #ddd; border-radius: 20px; margin-top: 30px; box-shadow: 0 8px 7px rgba(0, 0, 0, .1)} .list-area.golf-reservation .list-contents ul li:first-child { margin-top: 0} .list-area.golf-reservation .list-contents ul li span { text-align: left} .list-area.golf-reservation .list-contents ul li span.num { display: none} .list-area.golf-reservation .list-contents ul li span.number { display: block; width: auto; margin: 0 0 20px} .list-area.golf-reservation .list-contents ul li span.number .link-btn { display: inline-block; width: auto} .list-area.golf-reservation .list-contents ul li span.type { position: absolute; top: 20px; left: 95px; display: inline-block; width: auto; font-size: 13px; margin: 0 0 20px} .list-area.golf-reservation .list-contents ul li span.type:before { content: ""; display: inline-block; margin: -2px 10px 0 0; width: 1px; height: 12px; vertical-align: middle; background: #ddd} .list-area.golf-reservation .list-contents ul li span.name { display: block; width: auto; margin: 0 0 20px} .list-area.golf-reservation .list-contents ul li span.name .mobile-view { display: inline-block !important; font-size: 14px; color: #000; font-weight: bold} .list-area.golf-reservation .list-contents ul li span.branch { display: block; margin: 0 0 20px; width: auto; font-size: 13px; color: #000; font-weight: bold} .list-area.golf-reservation .list-contents ul li span.course { position: relative; margin: 0 0 20px; display: inline-block; width: auto; font-size: 13px; color: #000} .list-area.golf-reservation .list-contents ul li span.course br.pc { display: block !important} .list-area.golf-reservation .list-contents ul li span.course em { display: block; line-height: 1.5} .list-area.golf-reservation .list-contents ul li span.date { margin: 0 0 20px; width: 100%; font-size: 16px; font-weight: bold; color: #000; line-height: 1.4} .list-area.golf-reservation .list-contents ul li span.date .mobile-view { margin: 0; display: block !important; font-size: 16px; font-weight: bold} .list-area.golf-reservation .list-contents ul li span.date br.pc { display: block !important} .list-area.golf-reservation .list-contents ul li span.date em { display: block; width: auto; font-size: 16px; font-weight: bold; color: #000; line-height: 1.5} .list-area.golf-reservation .list-contents ul li span.date2 { margin: 0; width: 100%; font-size: 13px; color: #777} .list-area.golf-reservation .list-contents ul li span.date2 .mobile-view { display: inline-block !important; font-size: 13px; color: #777} .list-area.golf-reservation .list-contents ul li span.state { position: absolute; top: 75px; right: 20px; display: inline-block; width: auto} .list-area.golf-reservation .list-contents ul li span.state em { display: block; line-height: 1.5} .list-area.golf-reservation .list-contents ul li span.state .text-red br.pc { display: block !important} .list-area.golf-reservation.type2 { margin: 65px 0 0 0; border-top: none} .list-area.golf-reservation.type2 .total.type-left-point { left: 0} .list-area.golf-reservation.type2 .list-contents ul li { border: 1px solid #ddd; border-radius: 20px; margin-top: 30px; box-shadow: 0 8px 7px rgba(0, 0, 0, .1)} .list-area.golf-reservation.type2 .list-contents ul li:first-child { margin-top: 0} .list-area.golf-reservation.type2 .list-contents ul li span { text-align: left} .list-area.golf-reservation.type2 .list-contents ul li span.num { display: none} .list-area.golf-reservation.type2 .list-contents ul li span.number { display: block; width: auto} .list-area.golf-reservation.type2 .list-contents ul li span.number .link-btn { display: inline-block; width: auto} .list-area.golf-reservation.type2 .list-contents ul li span.recommend { display: block; width: 100%; margin: 15px 0 0 0; font-size: 13px; color: #000} .list-area.golf-reservation.type2 .list-contents ul li span.recommend .mobile-view { display: inline-block !important; font-size: 13px; color: #000} .list-area.golf-reservation.type2 .list-contents ul li span.recommend2 { display: block; width: 100%; margin: 15px 0 0 0; font-size: 13px; color: #000} .list-area.golf-reservation.type2 .list-contents ul li span.recommend2 .mobile-view { display: inline-block !important; font-size: 13px; color: #000} .list-area.golf-reservation.type2 .list-contents ul li span.type { position: absolute; top: 20px; left: 95px; display: inline-block; width: auto; font-size: 13px} .list-area.golf-reservation.type2 .list-contents ul li span.type:before { content: ""; display: inline-block; margin: -2px 10px 0 0; width: 1px; height: 12px; vertical-align: middle; background: #ddd} .list-area.golf-reservation.type2 .list-contents ul li span.branch { display: block; margin-top: 15px; width: auto; font-size: 13px; color: #000} .list-area.golf-reservation.type2 .list-contents ul li span.course { position: relative; margin-top: 5px; display: inline-block; width: auto; font-size: 13px; color: #000} .list-area.golf-reservation.type2 .list-contents ul li span.course br.pc { display: block !important} .list-area.golf-reservation.type2 .list-contents ul li span.date { margin: 10px 0; width: 100%; font-size: 16px; font-weight: bold; color: #000; line-height: 1.4} .list-area.golf-reservation.type2 .list-contents ul li span.date .mobile-view { margin: 10px 0; display: block !important; font-size: 16px; font-weight: bold} .list-area.golf-reservation.type2 .list-contents ul li span.date2 { margin-top: 20px; width: 100%; font-size: 13px; color: #777} .list-area.golf-reservation.type2 .list-contents ul li span.date2 .mobile-view { display: inline-block !important; font-size: 13px; color: #777} .list-area.golf-reservation.type2 .list-contents ul li span.state { position: absolute; top: 112px; right: 20px; display: inline-block; width: auto} .list-area.golf-reservation.type2 .list-contents ul li span.state .text-red br.pc { display: block !important} .list-area.wait-reservation { margin: 65px 0 0 0; border-top: none} .list-area.wait-reservation .total.type-left-point { left: 0} .list-area.wait-reservation .list-contents ul li { border: 1px solid #ddd; border-radius: 20px; margin-top: 30px; box-shadow: 0 8px 7px rgba(0, 0, 0, .1)} .list-area.wait-reservation .list-contents ul li .link-btn { padding: 22px} .list-area.wait-reservation .list-contents ul li:first-child { margin-top: 0} .list-area.wait-reservation .list-contents ul li span { text-align: left} .list-area.wait-reservation .list-contents ul li span.num { display: none} .list-area.wait-reservation .list-contents ul li span.number { display: block; width: auto} .list-area.wait-reservation .list-contents ul li span.number .link-btn { display: inline-block; width: auto} .list-area.wait-reservation .list-contents ul li span.branch { display: block; margin-top: 15px; width: auto; font-size: 13px; color: #000; font-weight: bold} .list-area.wait-reservation .list-contents ul li span.course { position: relative; margin-top: 5px; display: inline-block; width: auto; font-size: 13px; color: #000} .list-area.wait-reservation .list-contents ul li span.date { margin: 10px 0; width: 100%; font-size: 16px; font-weight: bold; color: #000; line-height: 1.4} .list-area.wait-reservation .list-contents ul li span.date .mobile-view { margin: 10px 0; display: block !important; font-size: 16px; font-weight: bold} .list-area.wait-reservation .list-contents ul li span.date2 { margin-top: 20px; width: 100%; font-size: 13px; color: #777} .list-area.wait-reservation .list-contents ul li span.date2 .mobile-view { display: inline-block !important; font-size: 13px; color: #777} .list-area.wait-reservation .list-contents ul li span.state { position: absolute; top: 75px; right: 20px; display: inline-block; width: auto} .list-area.wait-reservation .list-contents ul li span.state .text-red br.pc { display: block !important} .list-area.event-state { margin-top: 60px} .list-area.event-state .list-contents ul li span.title { padding: 0; width: 100%} .list-area.event-state .list-contents ul li span.title .state { display: inline-block; width: auto; min-width: 70px; margin-bottom: 10px; padding: 5px 10px; font-size: 13px} .list-area.event-state .list-contents ul li span.title .text { display: block; max-width: 100%; font-size: 15px; font-weight: bold} .list-area.event-state .list-contents ul li span.date { display: block; margin: 15px 0 0 0; width: 100%} .list-area.event-state .list-contents ul li span.date .mobile-view { display: inline-block !important; color: #555} .list-area.event-state .list-contents ul li span.date2 { display: inline-block; width: auto} .list-area.event-state .list-contents ul li span.date2 .mobile-view { display: inline-block !important; color: #555} .list-area.event-state .list-contents ul li span.date3 { position: relative; display: inline-block; width: auto} .list-area.event-state .list-contents ul li span.date3 .mobile-view { display: inline-block !important; color: #555} .list-area.event-state .list-contents ul li span.date3:before { content: ""; display: inline-block; margin: -2px 10px 0; width: 1px; height: 12px; vertical-align: middle; background: #ddd} .list-area.event-state .list-contents ul li span>span { vertical-align: top} } .detail-area { margin: 0 0 40px 0; border-top: 2px solid #555; border-bottom: 1px solid #ddd} @media screen and (max-width: 768px){ .detail-area { margin: -30px -20px 30px; border-top: none} } .detail-area .detail-title { position: relative; padding: 30px; border-bottom: 1px solid #ddd} @media screen and (max-width: 768px){ .detail-area .detail-title { padding: 20px} } .detail-area .detail-title span { display: block; margin-top: 10px} .detail-area .detail-title span:first-child { margin-top: 0} .detail-area .detail-title span.branch { color: #da291c} .detail-area .detail-title span.title { padding-right: 90px; font-size: 24px; line-height: 24px; line-height: 30px} @media screen and (max-width: 768px){ .detail-area .detail-title span.title { padding-right: 0; font-size: 18px; line-height: 24px; margin-top: 5px} } .detail-area .detail-title span.date { position: absolute; right: 30px; bottom: 30px; width: auto; color: #777} @media screen and (max-width: 768px){ .detail-area .detail-title span.date { position: static} } .detail-area .detail-contents { padding: 40px 30px; word-break: break-word} @media screen and (max-width: 768px){ .detail-area .detail-contents { padding: 30px 20px} } .detail-area .detail-contents img { display: block; margin: 0 auto} @media screen and (max-width: 768px){ .detail-area .detail-contents img { width: 100%} } .detail-area .detail-contents * { line-height: 1.3} .detail-area .detail-contents .down-area { margin: 80px -30px -40px; padding: 25px 30px; background: #f5f5f5} .detail-area .detail-contents .down-area:after { content: ""; display: block; clear: both} .detail-area .detail-contents .down-area dt { float: left; width: 110px} .detail-area .detail-contents .down-area dd { padding-left: 110px} .detail-area .detail-contents .down-area dd .btn-down { padding: 0} .detail-area .detail-contents .down-area dd .btn-down em { color: #777; text-decoration: underline} @media screen and (max-width: 768px){ .detail-area .detail-contents .down-area { margin: 40px -20px -30px; padding: 20px} .detail-area .detail-contents .down-area dt { width: 90px} .detail-area .detail-contents .down-area dd { padding-left: 90px} } [data-catagory=saleInformation] .content-detail.gimhae .table-border { border-collapse: initial} [data-catagory=saleInformation] .content-detail.gimhae .table-border td { border-top: none; border-bottom: none} [data-catagory=saleInformation] .content-detail.gimhae .table-border tr:last-child td { border-bottom: 1px solid #eee} [data-catagory=saleInformation] .content-detail.gimhae .table-border tr th+th, [data-catagory=saleInformation] .content-detail.gimhae .table-border tr td+td { border-left: none} [data-catagory=saleInformation] .content-detail.gimhae .table-border tr .no-border { border-bottom: none} [data-catagory=saleInformation] .step-list { padding: 30px 0 25px; display: flex; justify-content: center} [data-catagory=saleInformation] .step-list li { position: relative; display: inline-block; width: 16.6666666667%} [data-catagory=saleInformation] .step-list li::after { content: ""; width: 18px; height: 18px; border-top: 2px solid #ccc; border-right: 2px solid #ccc; display: inline-block; transform: rotate(45deg); position: absolute; top: 50%; left: 0; margin-top: -9px} [data-catagory=saleInformation] .step-list li:first-child::after { display: none} [data-catagory=saleInformation] .step-list li span { display: block; font-size: 16px; color: #000; word-break: keep-all} [data-catagory=saleInformation] .step-list li .step-num { margin: 0 auto 15px; width: 70px; text-align: center; font-size: 14px; color: #777; border: 1px solid #ccc; border-radius: 15px} [data-catagory=saleInformation] .templ-type-infolist-4 .infolist-tit { margin-bottom: 10px; color: #555; line-height: 26px} @media screen and (max-width: 768px) { [data-catagory=saleInformation] .step-list { flex-wrap: wrap; justify-content: center} [data-catagory=saleInformation] .step-list li { width: 33.3333333333%} [data-catagory=saleInformation] .step-list li:nth-child(-n+3) { margin-bottom: 40px} [data-catagory=saleInformation] .step-list li:nth-child(4)::after { display: none} [data-catagory=saleInformation] .step-list li::after { width: 9px; height: 9px} [data-catagory=saleInformation] .templ-type-infolist-4 .infolist-tit { font-size: 14px; line-height: 20px} } @media screen and (max-width: 768px) { [data-catagory=support] .faq-wrap { margin-top: -30px} } .list-sort { margin-bottom: 20px} .list-sort .total-count { display: inline-block; padding-top: 30px; font-size: 18px; line-height: 18px; color: #555} .list-sort .total-count strong { font-weight: 700; color: #000} @media screen and (max-width: 768px){ .list-sort { margin-bottom: 15px} .list-sort .total-count { padding-top: 30px; font-size: 15px; line-height: 15px} .list-sort .total-count strong { font-size: inherit; line-height: inherit} } .faq-list-content { border-top: 2px solid #555} .faq-list-content .no-data-box { margin-top: 0; border-top: 0} @media screen and (max-width: 768px){ .faq-list-content { margin: 0 -20px} .faq-list-content .no-data-box { margin: 0} } .faq-item { border-bottom: 1px solid #eee} .faq-item .question { position: relative} .faq-item .question .branch { position: absolute; top: 27px; left: 0; width: 120px; color: #555; text-align: center} .faq-item .question .title { display: block; padding: 22px 82px 22px 80px; line-height: 26px; word-break: break-all} .faq-item .question .title:before { position: absolute; top: 22px; left: 30px; width: 28px; height: 28px; margin-right: 20px; padding-top: 3px; border: 1px solid #dedede; border-radius: 100px; font-weight: 700; line-height: 16px; color: #555; text-align: center; content: "Q"} .faq-item .question:before, .faq-item .question:after { position: absolute; top: calc(50% - 8px); width: 1px; height: 16px; background-color: #888; content: ""} .faq-item .question:before { right: 47px; transform: rotate(-45deg)} .faq-item .question:after { right: 36px; transform: rotate(-135deg)} .faq-item .question.active+.answer { display: block} .faq-item .question.active .title { font-weight: 700} .faq-item .question.active:before { transform: rotate(45deg)} .faq-item .question.active:after { transform: rotate(135deg)} @media screen and (max-width: 768px){ .faq-item .question .branch { top: 23px; width: 80px; padding-left: 20px; font-size: 14px; line-height: 14px; text-align: left} .faq-item .question .title { display: block; padding: 19px 50px 19px 52px; font-size: 15px; line-height: 21px; word-break: break-all} .faq-item .question .title:before { top: 19px; left: 20px; width: 22px; height: 22px; margin-right: 10px; font-size: 12px; line-height: 12px} .faq-item .question:before, .faq-item .question:after { top: calc(50% - 6px); height: 13px} .faq-item .question:before { right: 34px} .faq-item .question:after { right: 25px} } .faq-item .answer { display: none; position: relative; padding: 35px 82px 30px 80px; border-top: 1px solid #ddd; background-color: #f5f5f5} .faq-item .answer:before { position: absolute; top: 35px; left: 30px; width: 28px; height: 28px; margin-right: 20px; padding-top: 4px; border-radius: 100px; background-color: #da291c; font-weight: 700; color: #fff; text-align: center; content: "A"} @media screen and (max-width: 768px){ .faq-item .answer { padding: 30px 20px 25px 52px} .faq-item .answer:before { top: 30px; left: 20px; width: 22px; height: 22px; margin-right: 10px; font-size: 12px; line-height: 12px} } .faq-item .answer .answer-content, .faq-item .answer .answer-content * { line-height: 26px; word-break: break-all} .faq-item .answer .answer-content .case1 *, .faq-item .answer .answer-content .case2 * { line-height: 26px} .faq-item .answer .answer-content .case1 { display: inline-block; width: 150px} @media screen and (max-width: 768px){ .faq-item .answer .answer-content .case1 { width: 90px} } .faq-item .answer .answer-content .case1 dt { font-weight: 700} .faq-item .answer .answer-content .case1 dd { color: #555} .faq-item .answer .answer-content .case2 { display: block; margin-top: 15px; color: #555} @media screen and (max-width: 768px){ .faq-item .answer .answer-content, .faq-item .answer .answer-content * { line-height: 21px} .faq-item .answer .answer-content .case1 *, .faq-item .answer .answer-content .case2 * { line-height: 21px} } [data-catagory=golfCourseNews] .templ-type-title { margin: 0 0 65px 0} [data-catagory=golfCourseNews] .templ-type-tab-medium { margin: 0 0 60px 0} @media screen and (max-width: 768px) { [data-catagory=golfCourseNews] .templ-type-tab-medium { margin: 0 0 40px 0} } [data-catagory=golfCourseNews] .partnership-box .partnership-list>li { display: table; width: 100%; padding: 60px 0; border-top: 1px solid #eee} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li:after { content: ""; display: block; clear: both} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li:first-child { padding-top: 0; border-top: none} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img { position: relative; display: table-cell; vertical-align: middle; width: 47%} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-container .swiper-wrapper .swiper-slide .img img { width: 100%; height: 340px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-pagination { width: 100%; top: 100%; left: 0; margin-top: 15px; font-size: 0} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-pagination .swiper-pagination-bullet { margin: 0 5px; width: 12px; height: 12px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-pagination .swiper-pagination-bullet-active { background-color: #da291c} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-button-prev { left: 20px; width: 18px; height: 34px; margin-top: -17px; background: url(../image/icon-swiper-prev-white.png) no-repeat; background-size: cover} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-button-next { right: 20px; width: 18px; height: 34px; margin-top: -17px; background: url(../image/icon-swiper-next-white.png) no-repeat; background-size: cover} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box { margin-left: 60px; padding: 18px 0; width: calc(100% - 60px)} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title { position: relative; font-size: 30px; line-height: 30px; font-weight: bold} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title .tag { display: inline-block; margin: -6px 0 0 8px; padding: 8px 10px; font-size: 13px; line-height: 13px; color: #fff; vertical-align: middle; background: #888} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title .tag+.tag { margin-left: 0} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title button { position: absolute; top: 50%; right: 0; transform: translateY(-50%)} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .text { margin-top: 15px; line-height: 22px; color: #555; font-size: 16px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .text+.text { font-size: 20px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list { margin-top: 25px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li { line-height: 26px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li .table-wrap { margin: 15px 0} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li .table-wrap thead th { text-align: center} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li .table-wrap tbody td { text-align: center} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li .table-wrap .table+p { margin-top: 10px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li .submit-complete { margin-top: 15px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap { margin-top: 25px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap .table .table-border tr { border-bottom: 1px solid #eee} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap .table .table-border tr th { padding-left: 30px; line-height: 22px; font-weight: bold; border: none} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap .table .table-border tr td { line-height: 22px; border: none} @media screen and (max-width: 768px) { [data-catagory=golfCourseNews] .partnership-box .partnership-list>li { padding: 50px 0 0 0; border: none} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img { float: none; display: block; width: 100%} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-container .swiper-wrapper .swiper-slide .img img { height: auto} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-pagination { margin-top: 10px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-pagination .swiper-pagination-bullet { margin: 0 3px; width: 10px; height: 10px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-button-prev { left: 10px; width: 13px; height: 24px; margin-top: -12px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .swiper-img .swiper-button-next { right: 10px; width: 13px; height: 24px; margin-top: -12px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box { float: none; margin: 40px 0 0 0; padding: 0; width: 100%} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title { font-size: 22px; line-height: 22px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title .tag { margin: -4px 0 0 5px; padding: 6px 10px; font-size: 12px; line-height: 12px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .title .tag+.tag { margin-left: 0px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .text { line-height: 20px; font-size: 14px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .text+.text { margin-top: 5px; font-size: 18px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list { margin-top: 20px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .list li { line-height: 20px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .content-box .submit-complete { min-width: 170px; margin-left: 0 !important} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap { margin-top: 20px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap .table .table-border tr th { padding: 15px; line-height: 20px} [data-catagory=golfCourseNews] .partnership-box .partnership-list>li .table-wrap .table .table-border tr th { line-height: 20px} } [data-catagory=golfCourseNews] .modal-pop-area .contents.golftel .pop-scroll-box { bottom: 0} [data-catagory=golfCourseNews] .modal-pop-area .contents.golftel .pop-scroll-box .table-wrap .table-title { margin-top: 40px; font-size: 22px; line-height: 22px} [data-catagory=golfCourseNews] .modal-pop-area .contents.golftel .pop-scroll-box .table-wrap .table-title:first-child { margin-top: 0} @media screen and (max-width: 768px) { [data-catagory=golfCourseNews] .modal-pop-area .contents.golftel .pop-scroll-box .table-wrap .table-title { font-size: 15px; line-height: 15px; margin-top: 30px; margin-bottom: 15px} } .nearby-event-map-list { min-width: 1280px; margin-bottom: 80px} .nearby-event-map-list:after { content: ""; display: block; clear: both} .nearby-event-map-list .thumbnail { float: left} .nearby-event-map-list .thumbnail .zoom { display: none} .nearby-event-map-list .nearby-list-area { float: right; width: 340px; border-top: 2px #555 solid} .nearby-event-map-list .nearby-list-area>.nearby-list { margin-bottom: 18px} .nearby-event-map-list .nearby-list-area>.nearby-list ul { width: calc(100% - 4px); height: 600px} .nearby-event-map-list .nearby-list-area>.nearby-list ul li a { display: block; padding: 15px 0; border-bottom: 1px #eee solid} .nearby-event-map-list .nearby-list-area>.nearby-list ul li a span { display: block; font-weight: bold; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; padding-bottom: 5px} .nearby-event-map-list .nearby-list-area>.nearby-list ul li a em { display: block; color: #777; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; margin-top: 8px} .nearby-event-map-list .nearby-list-area>.nearby-list .scroll-element.scroll-y { right: 0} .nearby-event-map-list .nearby-list-area .bt-small { margin-top: 10px} @media screen and (max-width: 768px){ .nearby-event-map-list { min-width: 100%; margin-bottom: 50px} .nearby-event-map-list .thumbnail { position: relative; float: inherit; margin: 0 -20px 40px} .nearby-event-map-list .thumbnail img { width: 100%} .nearby-event-map-list .thumbnail .zoom { display: block; position: absolute; right: 20px; top: 20px; width: 40px; height: 40px; background-color: rgba(0, 0, 0, .5)} .nearby-event-map-list .thumbnail .zoom::before { content: ""; background-image: url("data:image/svg+xml; charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='53px' height='53px'%3e%3cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M38.293,39.707 L39.707,38.293 L51.707,50.293 L50.293,51.707 L38.293,39.707 Z'/%3e%3cpath fill-rule='evenodd' stroke='rgb(255, 255, 255)' stroke-width='2px' stroke-linecap='round' stroke-linejoin='round' fill='none' d='M23.500,1.000 C35.926,1.000 46.000,11.074 46.000,23.500 C46.000,35.926 35.926,46.000 23.500,46.000 C11.074,46.000 1.000,35.926 1.000,23.500 C1.000,11.074 11.074,1.000 23.500,1.000 Z'/%3e%3cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M32.000,25.000 L25.000,25.000 L25.000,32.000 C25.000,32.552 24.552,33.000 24.000,33.000 C23.448,33.000 23.000,32.552 23.000,32.000 L23.000,25.000 L16.000,25.000 C15.448,25.000 15.000,24.552 15.000,24.000 C15.000,23.448 15.448,23.000 16.000,23.000 L23.000,23.000 L23.000,16.000 C23.000,15.448 23.448,15.000 24.000,15.000 C24.552,15.000 25.000,15.448 25.000,16.000 L25.000,23.000 L32.000,23.000 C32.552,23.000 33.000,23.448 33.000,24.000 C33.000,24.552 32.552,25.000 32.000,25.000 Z'/%3e%3c/svg%3e"); background-size: 100% 100%; display: inline-block; border-radius: 0; background-color: rgba(0, 0, 0, 0); width: 26px; height: 26px; margin: 8px 0 0 8px} .nearby-event-map-list .nearby-list-area { float: inherit; width: 100%; margin: 0 0} .nearby-event-map-list .nearby-list-area>.nearby-list { margin-bottom: 10px} .nearby-event-map-list .nearby-list-area>.nearby-list ul { height: initial} .nearby-event-map-list .nearby-list-area>.nearby-list ul li a { display: block; padding: 15px 0; border-bottom: 1px #eee solid} .nearby-event-map-list .nearby-list-area>.nearby-list ul li a span { display: block; font-weight: bold; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; padding-bottom: 5px} .nearby-event-map-list .nearby-list-area>.nearby-list ul li a em { display: block; color: #777; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; margin-top: 8px} .nearby-event-map-list .nearby-list-area>.nearby-list .scroll-element.scroll-y { right: 0} .nearby-event-map-list .nearby-list-area .bt-small { margin-top: 10px} } .templ-type-nearby { display: inline-block; font-size: 22px; line-height: 22px; font-weight: bold; margin-bottom: 30px} .templ-type-nearby::after { content: ""; display: block; width: 100%; height: 6px; margin-top: -3px; background-color: #33aeb6} @media screen and (max-width: 768px){ .templ-type-nearby { font-size: 16px; line-height: 16px; margin-bottom: 20px} } .nearby-event-area ul { margin: 0 -10px 0} .nearby-event-area ul:after { content: ""; display: block; clear: both} .nearby-event-area ul li { float: left; width: 25%; padding: 0 10px 0} .nearby-event-area ul li:last-child { padding-right: 0} .nearby-event-area ul li a { display: block; border: 1px #eee solid; width: 100%; padding: 30px} .nearby-event-area ul li a .thumbnail { margin: -30px -30px 30px} .nearby-event-area ul li a .thumbnail img { width: 100%} .nearby-event-area ul li span { display: block; font-size: 18px; line-height: 18px; font-weight: bold; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden} .nearby-event-area ul li em { display: block; color: #777; font-size: 16px; line-height: 16px; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; margin-top: 10px} @media screen and (max-width: 768px){ .nearby-event-area ul li { width: 50%; padding: 0 5px 10px} .nearby-event-area ul li a { padding: 15px} .nearby-event-area ul li a .thumbnail { margin: -15px -15px 15px} .nearby-event-area ul li a .thumbnail img { width: 100%} .nearby-event-area ul li span { display: block; font-size: 13px; line-height: 13px; font-weight: bold; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden} .nearby-event-area ul li em { display: block; color: #777; font-size: 11px; line-height: 11px; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; margin-top: 7px} } .being-page-wrap .partnership-box .partnership-list>.faq-item-new { padding: 10px 0 0 0; border-bottom: 0} @media screen and (max-width: 768px){ .being-page-wrap .partnership-box .partnership-list { border-bottom: 1px solid #eee} } .being-page-new .faq-item .question .title::before { content: ""; background-image: url(../image/icon_accordion_01.png); background-position: center; border: none} @media screen and (max-width: 768px){ .being-page-new .faq-item .question .title::before { padding-top: 0; background-size: cover} } .being-page-new .faq-item .question .title1::before { background-image: url(../image/icon_accordion_04.png)} .being-page-new .faq-item .question .title2::before { background-image: url(../image/icon_accordion_02.png)} .being-page-new .faq-item .question .title3::before { background-image: url(../image/icon_accordion_03.png)} .being-page-new .table-wrap .table { border-top: 1px solid #6a6a6a} .being-page-wrap .templ-type-tab-medium-new { margin: 0} @media screen and (max-width: 768px){ .being-page-wrap .templ-type-tab-medium-new { padding: 0px 0px} } .being-page-new .faq-item .question.active .title { font-weight: 700} .being-page-new .faq-wrap-new { background-color: #fbfbfb} @media screen and (max-width: 768px){ .being-page-new .faq-wrap-new { border-top: 1px solid #ddd} } .being-page-new .faq-wrap-bg { padding: 70px 0 70px 0} @media screen and (max-width: 768px){ .being-page-new .faq-wrap-bg { width: 90%; margin: 0 auto; padding: 0 0 30px 0} } .being-page-new .partnership-box .partnership-list>li .content-box { padding: 0 0; width: calc(100% - 208px); margin: 0 auto} .being-page-new .partnership-box .partnership-list>li .content-box .table-wrap thead th { padding: 15px 40px; text-align: center} @media screen and (max-width: 768px){ .being-page-new .partnership-box .partnership-list li .content-box { width: 100%} } .being-page-new .faq-wrap-bg .area-image-new .inner-img-new { text-align: center; max-width: 840px; margin: 0 auto} .being-page-new .partnership-box .partnership-list>li .table-wrap .table .table-border tbody tr th { border-right: 1px solid #e3e3e3; text-align: center; padding: 16px 40px; font-weight: 500; background-color: #fff} @media screen and (max-width: 768px){ .being-page-new .partnership-box .partnership-list>li .table-wrap .table .table-border tbody tr th { padding: 0px 0px} } .being-page-new .partnership-box .partnership-list>li .table-wrap .table .table-border tbody tr td { background-color: #fff} .being-page-new .partnership-box .partnership-list>li .content-box .table-wrap tbody td { text-align: left; padding: 10px 20px; color: #333} .being-page-new .inner-img-new>img { width: 100%; max-width: 100%} .being-page-new .faq-list-content { border-top: 0} @media screen and (max-width: 768px){ .wrap .container>.contents-area-center-new { padding: 30px 0px 40px} header .header-inner .head-title strong { text-align: left; font-weight: 700} .being-page-new .area-image-new { padding-top: 30px} } .being-page-new .partnership-box .partnership-list .faq-item-new { border-bottom: 1px solid #e3e3e3} .being-page-new .partnership-box .partnership-list .faq-item-new:last-child { border-bottom: 0} [data-catagory=golfCourseNews] .myscore-box { margin: -10px 0 30px; border: 1px solid #33aeb6; background: #f5fcfc} [data-catagory=golfCourseNews] .myscore-box ul { position: relative; padding: 15px; font-size: 0; text-align: center} [data-catagory=golfCourseNews] .myscore-box ul li { display: inline-block; vertical-align: middle; font-size: 0} [data-catagory=golfCourseNews] .myscore-box ul li span { position: relative; display: inline-block; line-height: 26px; vertical-align: middle} [data-catagory=golfCourseNews] .myscore-box ul li span.mark { padding: 6px 15px; font-size: 14px; line-height: 14px; color: #fff; border-radius: 20px; background-color: #33aeb6} [data-catagory=golfCourseNews] .myscore-box ul li span.rank { margin-left: 10px; font-weight: bold} [data-catagory=golfCourseNews] .myscore-box ul li span.name { margin-left: 30px} [data-catagory=golfCourseNews] .myscore-box ul li span.score:before { content: ""; margin: -2px 10px 0; display: inline-block; width: 1px; height: 16px; vertical-align: middle; background-color: #ddd} [data-catagory=golfCourseNews] .myscore-box ul li span.date:before { content: ""; margin: -2px 10px 0; display: inline-block; width: 1px; height: 16px; vertical-align: middle; background-color: #ddd} [data-catagory=golfCourseNews] .myscore-box ul li span.branch:before { content: ""; margin: -2px 10px 0; display: inline-block; width: 1px; height: 16px; vertical-align: middle; background-color: #ddd} @media screen and (max-width: 768px) { [data-catagory=golfCourseNews] .myscore-box { margin: 0 0 30px} [data-catagory=golfCourseNews] .myscore-box ul { display: table; padding: 30px 0; width: 100%} [data-catagory=golfCourseNews] .myscore-box ul li { display: table-cell; vertical-align: middle; border-left: 1px solid #eee} [data-catagory=golfCourseNews] .myscore-box ul li:nth-child(1) { width: 30%; border-left: none} [data-catagory=golfCourseNews] .myscore-box ul li:nth-child(2) { width: 33.5%} [data-catagory=golfCourseNews] .myscore-box ul li:nth-child(3) { width: 36.5%; padding: 0 15px} [data-catagory=golfCourseNews] .myscore-box ul li span { line-height: 20px} [data-catagory=golfCourseNews] .myscore-box ul li span.mark { position: absolute; top: 0; left: 0; border-radius: 0} [data-catagory=golfCourseNews] .myscore-box ul li span.rank { margin: 0} [data-catagory=golfCourseNews] .myscore-box ul li span.name { margin: 0} [data-catagory=golfCourseNews] .myscore-box ul li span.score:before { content: "/"; margin: -2px 2px 0; width: auto; height: auto; font-size: 14px; line-height: 14px; background: none} [data-catagory=golfCourseNews] .myscore-box ul li span.date { display: block; text-align: left} [data-catagory=golfCourseNews] .myscore-box ul li span.date:before { display: none} [data-catagory=golfCourseNews] .myscore-box ul li span.branch { display: block; text-align: left} [data-catagory=golfCourseNews] .myscore-box ul li span.branch:before { display: none} } [data-catagory=golfCourseNews] .table-wrap.fame .info-text { margin-bottom: 20px; color: #777; text-align: right} [data-catagory=golfCourseNews] .table-wrap.fame .info-text * { color: #777} [data-catagory=golfCourseNews] .table-wrap.fame .info-box { margin: -10px 0 20px; position: relative} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .select-box { position: absolute; bottom: 5px; right: 0; width: 200px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .select-box em { padding: 7px 0; height: 32px; border-bottom-width: 1px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .select-box:before { top: 14px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .select-box ul { top: 31px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box h3 { font-size: 20px; line-height: 20px; font-weight: bold} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .list { margin-top: 15px; font-size: 0} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .list li { position: relative; display: inline-block; color: #777} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .list li+li:before { content: ""; display: inline-block; margin: -2px 8px 0 10px; width: 1px; height: 16px; vertical-align: middle; background: #eee} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .list li span { color: #777} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border thead tr th { position: relative; padding: 17px 0; font-weight: bold; border-left: none; border-right: none; background: none} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border thead tr th+th:before { content: ""; display: block; position: absolute; top: calc(50% - 7px); left: 0; width: 1px; height: 14px; background: #eee} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td { padding: 17px 10px; border-left: none; border-right: none} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td span.rank { padding-left: 50px} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr.top td span.rank { position: relative; font-weight: bold} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr.top td span.rank:before { content: ""; display: block; position: absolute; top: calc(50% - 15px); left: 0; width: 35px; height: 30px; background: url(../image/icon-fame.png) no-repeat} @media screen and (max-width: 768px) { [data-catagory=golfCourseNews] .table-wrap.fame .info-text { margin-bottom: 15px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box { margin: -10px 0 15px; padding-top: 55px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .select-box { top: 0; bottom: auto; width: 50%} [data-catagory=golfCourseNews] .table-wrap.fame .info-box h3 { font-size: 17px; line-height: 17px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .list li { display: block; line-height: 20px} [data-catagory=golfCourseNews] .table-wrap.fame .info-box .list li+li:before { display: none} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border thead tr th { padding: 12px 5px} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td { padding: 12px 5px} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td.date-branch { padding: 12px 20px} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td span.rank { padding-left: 32px} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td span.date, [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td span.branch { display: block; text-align: left} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr td span.slash { display: none} [data-catagory=golfCourseNews] .table-wrap.fame .table .table-border tbody tr.top td span.rank:before { top: calc(50% - 10.5px); width: 26px; height: 21px; background: url(../image/icon-fame-mo.png) no-repeat; background-size: cover} } [data-catagory=golfCourseNews] .templ-type-infolist-1 { margin-top: 60px} [data-catagory=golfCourseNews] .templ-type-infolist-1 .point { font-weight: bold; color: #da291c} [data-catagory=golfCourseNews] .templ-type-tab-small { margin-bottom: 50px} @media screen and (max-width: 768px) { [data-catagory=golfCourseNews] .templ-type-tab-small { margin-bottom: 22px} [data-catagory=golfCourseNews] .templ-type-infolist-1 { margin-top: 40px} }