@charset "UTF-8"; /* RESET ------------------------------------------ */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, input, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; } a { text-decoration: none; } ol, ul { margin: 0; padding: 0; list-style: none; } ol { list-style: decimal; } img { vertical-align: bottom; } table { border-collapse: collapse; border-spacing: 0; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; } /* DEFAULT ------------------------------------------ */ * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { font-size: 18px; } body { color: #262626; line-height: 1.75; font-family: Arial, "游ゴシック Medium", "Yu Gothic Medium", YuGothicM, 游ゴシック体, YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "Meiryo UI",メイリオ, Meiryo, sans-serif; font-feature-settings: "palt" 1; word-wrap: break-word; overflow-wrap: break-word; -webkit-text-size-adjust: 100%; } a { color: #262626; text-decoration: none; border: none; -webkit-transition: color .2s; -o-transition: color .2s; transition: color .2s; } a [class^="icon-"] { -webkit-transition: color .2s; -o-transition: color .2s; transition: color .2s; } a:hover { color: #CC0000; } a:hover [class^="icon-"] { color: #CC0000; } /* HEADER ------------------------------------------ */ /* global nav */ #nav-global { position: relative; z-index: 9999; height: 50px; background-color: #0C0C0C; } #nav-global .nav-strip-red { position: absolute; z-index: 15; top: 0; width: 100%; height: 3px; background-color: #CC0000; } #nav-global .pg-container { position: relative; top: 0; overflow: visible; } #nav-global .logo { position: absolute; top: 0; left: 0; width: 60px; height: 60px; } #nav-global a { color: #bfbfbf; } #nav-global a:hover { color: #fff; } #nav-global .login { position: absolute; top: 15px; right: 60px; font-size: 0.77rem; text-align: right; } #nav-global #menu { height: 50px; margin-left: 70px; } #nav-global #menu li { position: relative; display: inline-block; height: 100%; } #nav-global #menu li a { position: relative; display: inline-block; height: 100%; padding: 0 9px 0 3px; font-size: 0.77rem; line-height: 3.5; letter-spacing: 0.01em; color: #bfbfbf; text-align: center; } #nav-global #menu li a:after { position: absolute; content: ""; display: block; top: 35%; right: 0; width: 1px; height: 25%; background-color: #595959; } #nav-global #menu li a:hover { color: #fff; } #nav-global #menu li ul { position: absolute; top: 50px; z-index: 1000; display: none; } #nav-global #menu li ul li { display: list-item; padding-bottom: inherit; } #nav-global #menu li ul a { padding: 0 15px; text-align: left; background-color: #000; color: #bfbfbf; width: 200px; } #nav-global #menu li ul a::after { display: none; } /* search */ .search { margin: 15px 0; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; -ms-transition: opacity 0.3s; -o-transition: opacity 0.3s; transition: opacity 0.3s; opacity: 1; } .search .search-txt { display: inline-block; float: left; width: calc(100% - 60px) !important; height: 30px !important; border: 0; border-radius: 0; font-size: 16px; font-weight: 300; line-height: 30px; padding: 0 .5em; background-color: #fff; } .search input[type="submit"] { display: inline-block; position: relative; cursor: pointer; width: 60px; height: 30px; text-align: center; font-weight: bold; background-color: #d9d9d9; vertical-align: top; } .search .btn-search-show { display: none; } .slicknav_hidden .search { opacity: 0; } /* global nav sp */ .slicknav_menu { display: none; } .slicknav_btn { position: absolute; z-index: 10; top: 0; right: 0; display: block; width: 50px; height: 50px; -webkit-transition: color .2s; -o-transition: color .2s; transition: color .2s; cursor: pointer; background-color: #000; } .slicknav_btn .slicknav_icon { display: block; width: 100%; height: 100%; padding: 18px 15px 15px; } .slicknav_btn .slicknav_icon-bar { display: block; width: 20px; height: 2px; margin-bottom: 4px; background: #bfbfbf; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transition: background .3s,-webkit-transform .3s,opacity .3s; transition: background .3s,-webkit-transform .3s,opacity .3s; -o-transition: transform .3s,background .3s,opacity .3s; transition: transform .3s,background .3s,opacity .3s; transition: transform .3s,background .3s,-webkit-transform .3s,opacity .3s; } .slicknav_btn:hover .slicknav_icon-bar { background: #fff; } .slicknav_btn.slicknav_open .slicknav_icon-bar { background: #CC0000; -webkit-transform: translateY(6px) rotate(-45deg); -ms-transform: translateY(6px) rotate(-45deg); transform: translateY(6px) rotate(-45deg); } .slicknav_btn.slicknav_open .slicknav_icon-bar:nth-of-type(2) { opacity: 0; } .slicknav_btn.slicknav_open .slicknav_icon-bar:nth-of-type(3) { -webkit-transform: translateY(-6px) rotate(45deg); -ms-transform: translateY(-6px) rotate(45deg); transform: translateY(-6px) rotate(45deg); } .slicknav_menu { *zoom: 1; } .slicknav_menu::before { content: " "; display: table; } .slicknav_menu:after { content: " "; display: table; clear: both; } .slicknav_nav { clear: both; margin: 50px -10px 0; padding: 5px 15px 15px; background: #000; height: calc(100vh - 50px); overflow: scroll !important; } .slicknav_nav ul, .slicknav_nav li, .slicknav_nav a { display: block; } .slicknav_nav li { width: 50%; float: left; } .slicknav_nav li:first-of-type, .slicknav_nav li:nth-of-type(2) { width: 100%; } .slicknav_nav li:first-of-type li, .slicknav_nav li:nth-of-type(2) li { width: 100%; } .slicknav_nav li:nth-of-type(odd) { clear: both; } .slicknav_nav a { padding: 5px 0; color: #bfbfbf; } .slicknav_nav .slicknav_arrow { display: none; } .slicknav_nav .slicknav_item { position: relative; cursor: pointer; } .slicknav_nav .slicknav_item a { display: inline; } .slicknav_nav li li { padding-left: 15px; } .slicknav_nav .slicknav_row { display: block; } /* Media Queries */ @media screen and (max-width: 959px) { #menu { display: none; } .slicknav_menu { display: block; } } .fixed { position: fixed !important; top: 0; left: 0; width: 100%; } /* FOOTER ------------------------------------------ */ .list-service { display: -moz-flex; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; padding-top: 50px; } .list-service li { width: 50%; margin-bottom: 15px; text-align: center; } .list-service li img { max-width: 100%; } .list-service li small { display: block; margin-top: 10px; font-size: 0.65rem; } footer { clear: both; padding: 30px 0; color: #bfbfbf; text-align: center; background-color: #000; } footer a:hover { text-decoration: underline; } footer .sns { display: flex; justify-content: center; align-items: center; } footer .sns li { display: inline-block; margin: 0 10px; } footer .sns li a { display: flex; align-items: center; justify-content: center; width: 20px; text-align: center; color: #fff; font-size: 21px; } footer .sns li a:hover { text-decoration: none; } footer .sns li.x a svg { fill: #fff; } footer .sns li.x a:hover svg { fill: #CC0000; } .footer-link-category li { display: inline-block; padding: 0 5px; } .footer-link-category a { color: #fff; } .footer-link-alt li, .footer-link-remarks li { display: inline-block; padding: 0 10px 0 5px; color: #fff; font-size: 0.65rem; line-height: 1; border-right: 1px solid #fff; } .footer-link-alt li a, .footer-link-remarks li a { color: #fff; } .footer-link-remarks li { border: none; } .footer-link-remarks li a { color: #bfbfbf; } /* LAYOUT ------------------------------------------ */ /* container */ .pg-wrapper { padding-top: 15px; } .pg-wrapper .pg-container { background-color: #fff; } .pg-container { clear: both; width: 100%; padding: 0 10px; overflow: hidden; } /* column */ .cl { width: 100%; } /* content box */ .cb { width: 100%; padding-bottom: 20px; overflow: hidden; font-size: 0.77rem; } [class*="cb-"] { padding-bottom: 20px; font-size: 0.77rem; } .cb-l4, .cb-l3s2, .cb-l2s2 { float: left; width: calc(50% - 10px); margin: 0 10px; } .cb-l4:nth-of-type(odd), .cb-l3s2:nth-of-type(odd), .cb-l2s2:nth-of-type(odd) { clear: both; margin-left: 0; } .cb-l4:nth-of-type(even), .cb-l3s2:nth-of-type(even), .cb-l2s2:nth-of-type(even) { margin-right: 0; } .cb-gray-round { padding: 15px; background: #f2f2f2; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } /* align */ .ta-c { text-align: center; } /* ELEMENT ------------------------------------------ */ /* card */ .cd { width: 100%; } .cd .media-img { position: relative; width: 100%; /*height: 100%;*/ padding: 56.25% 0 0; overflow: hidden; } .cd .media-img img { /* width: 100%; */ position: absolute; bottom: 50%; right: 50%; -webkit-transform: translate(50%, 50%); transform: translate(50%, 50%); max-width: 100%; height: 100%; /*&.top {max-width: 760px;}*/ } .cd .media-img .label-breaking, .cd .media-img .label-black { position: absolute; bottom: 0; left: 0; padding: 10px; font-size: 0.77rem; font-weight: 700; font-family: Arial, sans-serif; line-height: 1.3333333333; background-color: #CC0000; color: #fff; } .cd .media-img .label-black {background-color: #001a2c;} .cd .media-img .icon { position: absolute; bottom: 0; left: 0; padding: 5px; background: rgba(13, 13, 13, 0.3); font-size: 1.0rem; line-height: 1; color: #fff; } .cd .cd-ttl { padding: 7px 0; line-height: 1.25; } .cd .cd-ttl-overlay { position: absolute; left: 0; bottom: 0; width: 100%; padding: 10px; line-height: 1.25; background: rgba(250, 250, 250, 0.85); } /* breadcrumbs */ .breadcrumbs { margin: 10px 0; } .breadcrumbs li { position: relative; display: inline-block; padding: 0 15px 0 5px; font-size: 0.77rem; } .breadcrumbs li::after { position: absolute; content: ""; display: block; top: 0; right: 0; font-family: 'icon-font'; content: '\f105'; } .breadcrumbs li:last-child::after { display: none; } /* heading */ .wordwrap { display: inline-block; } h1 { line-height: 1.25; } .ttl-gray { clear: both; padding: 7px; position: relative; color: #404040; font-size: 0.9rem; font-weight: 700; line-height: 1.375; background-color: #f2f2f2; -webkit-transition: background-color .3s; -o-transition: background-color .3s; transition: background-color .3s; } a.ttl-link { display: block; position: relative; clear: both; } a.ttl-link i { position: absolute; top: 0; right: 0; height: 100%; padding: 0 14px; font-size: 1.3rem; line-height: 1.5; background-color: #e6e6e6; -webkit-transition: background-color .3s; -o-transition: background-color .3s; transition: background-color .3s; } a.ttl-link:hover .ttl-gray { background-color: #e6e6e6; } a.ttl-link:hover i { background-color: #bfbfbf; } .ttl-stripe { overflow: hidden; padding: 0 0 15px; position: relative; width: 100%; font-size: 1.5rem; line-height: 1.25; } .ttl-stripe .stripe { display: inline-block; height: 16px; vertical-align: bottom; } .ttl-stripe .stripe::after { content: ""; display: inline-block; position: absolute; top: 50%; width: 100%; height: 1px; margin-top: -13px; border-top: 4px solid #d9d9d9; border-bottom: 4px solid #d9d9d9; } .ttl-exclusive_badge, .ttl-black_badge { bottom: 0; left: 0; padding: 5px; font-size: 0.77rem; font-weight: 700; font-family: Arial, sans-serif; line-height: 1.3333333333; background-color: #CC0000; color: #fff; display: inline-block; } .ttl-black_badge {background-color: #001a2c;} a.ttl-exclusive_badge:hover, a.ttl-black_badge:hover { color: #fff; } .ttl-headline-top { padding-top: 10px; padding-bottom: 10px; font-size: 1.5rem; line-height: 1.25; letter-spacing: -0.03em; } .ttl-headline-sub { font-size: 0.9rem; } /* pagination */ .pagination { clear: both; width: 100%; text-align: center; } .pagination li { display: inline-block; } .pagination li a { display: block; padding: 0 12px; font-size: 0.9rem; } .pagination li a:hover, .pagination li a.current { color: #CC0000; font-weight: bold; } /* font */ .txt-source, .txt-time { font-size: 0.65rem; color: #737373; } .txt-time { padding-left: 10px; } .al-r { text-align: right; } @font-face { font-family: 'icon-font'; src: url("/static/fonts/icon-font.eot?repajd"); src: url("/static/fonts/icon-font.eot?repajd#iefix") format("embedded-opentype"), url("/static/fonts/icon-font.ttf?repajd") format("truetype"), url("/static/fonts/icon-font.woff?repajd") format("woff"); font-weight: normal; font-style: normal; } [class^="icon-"], [class*=" icon-"] { font-family: 'icon-font' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-search:before { content: "\f002"; } .icon-user:before { content: "\f007"; } .icon-home:before { content: "\f015"; } .icon-clock-o:before { content: "\f017"; } .icon-play-circle-o:before { content: "\f01d"; } .icon-tag:before { content: "\f02b"; } .icon-camera:before { content: "\f030"; } .icon-twitter:before { content: "\f099"; } .icon-facebook:before { content: "\f09a"; } .icon-rss:before { content: "\f09e"; } .icon-angle-double-left:before { content: "\f100"; } .icon-angle-double-right:before { content: "\f101"; } .icon-angle-left:before { content: "\f104"; } .icon-angle-right:before { content: "\f105"; } .icon-angle-up:before { content: "\f106"; } .icon-angle-down:before { content: "\f107"; } /* list */ [class^="list-"] li { padding: 7px 0; line-height: 1.3; } .list-disc { margin-left: 25px; } .list-disc li { list-style-type: disc; } .list-news-line li { padding: 15px 0; font-size: 0.9rem; border-top: 1px solid #d9d9d9; overflow: hidden; } .list-news-line li i[class^="icon-"] { margin-left: 10px; } .list-col-l2 { display: flex; flex-wrap: wrap; margin-top: 10px; } .list-col-l2 li { width: 100%; } .exclusive_badge, .black_badge, .list-news-line li a .label-breaking { margin-right: 5px; color: #CC0000; font-size: 0.65rem; font-weight: bold; } .black_badge {color: #001a2c;} .list-news-line .list-thumb { width: 100px; float: left; margin: -7px 10px 0 0; } .list-rank { list-style: none; } .list-rank li { position: relative; min-height: 3em; padding: 15px 0 15px 30px; border-top: 1px solid #d9d9d9; counter-increment: count; } .list-rank li::before { position: absolute; content: ""; display: block; top: 50%; left: 0; margin-top: -18px; content: counter(count); font-size: 1.6rem; font-weight: bold; line-height: 1; color: #cdcdcd; } .list-rank li:first-of-type::before, .list-rank li:nth-of-type(2)::before, .list-rank li:nth-of-type(3)::before { color: #CE1018; } /* slider */ .slider { margin-bottom: 20px; line-height: 1.25; } .slider .ttl-slider { margin: 15px 0; } #pg-photo .slider p { margin-top: 15px; padding-bottom: 0; color: #FFF; font-size: 1rem; } .slider img { margin-bottom: 0 !important; } .slider .slider-main { position: relative; } .slider .slider-main .cb { padding-bottom: 0; } .slider .slider-main .cd-ttl-overlay { padding: 5px; font-size: 0.9rem; } .slider .slider-main .recommend { overflow: hidden; padding: 0 30px; } .slider .slider-main .recommend .cb-l2s2 { width: 100%; float: none; margin: 0; padding-bottom: 10px; } .slider .slider-main .recommend .cb-l2s2 .cd .media-img { position: static; padding: 0; } .slider .slider-main .recommend .cb-l2s2 .cd .media-img img { position: static; -webkit-transform: translate(0, 0); transform: translate(0, 0); width: 100px; height: auto; float: left; margin-right: 10px; } .slider .slider-main .recommend .cb-l2s2 .cd .media-img .cd-ttl-overlay { position: static; background: none; } .slider .slider-main .recommend .cb-l2s2 .cd-ttl-overlay { padding: 5px; font-size: 0.77rem; font-weight: normal; } .slider .slider-nav { width: 100%; } .slider .slider-nav .slider-nav-prev, .slider .slider-nav .slider-nav-next { position: absolute; top: 0; left: 0; width: 30px; height: 100%; padding: 0; font-size: 1.5rem; -webkit-transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; } .slider .slider-nav .slider-nav-prev i, .slider .slider-nav .slider-nav-next i { position: absolute; top: calc(50% - 14px); left: 10px; display: block; width: 20px; height: 20px; border-top: 2px solid #0C0C0C; border-left: 2px solid #0C0C0C; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.25)); -moz-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.25)); -o-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.25)); -ms-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.25)); filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.25)); } .slider .slider-nav .slider-nav-prev i:before, .slider .slider-nav .slider-nav-next i:before { display: none; } .slider .slider-nav .slider-nav-prev:hover, .slider .slider-nav .slider-nav-next:hover { cursor: pointer; color: #CC0000; } .slider .slider-nav .slider-nav-prev:hover i, .slider .slider-nav .slider-nav-next:hover i { border-color: #CC0000; } .slider .slider-nav .slider-nav-next { left: auto; right: 0; } .slider .slider-nav .slider-nav-next i { left: auto; right: 10px; border: none; border-bottom: 2px solid #0C0C0C; border-right: 2px solid #0C0C0C; } .slider .slider-thumb { position: relative; width: 100%; overflow: hidden; margin-top: 20px; padding: 0 30px; } .slider .slider-thumb .slider-nav-prev, .slider .slider-thumb .slider-nav-next { background-color: #fff; } .slider .slider-thumb .slider-nav-prev i, .slider .slider-thumb .slider-nav-next i { top: 20px; -webkit-filter: none; -moz-filter: none; -o-filter: none; -ms-filter: none; filter: none; } .slider .slider-thumb li { float: left; width: 100px; margin-right: 5px; } .slider .slider-thumb li.current img { border: 3px solid #CC0000; } .slider .slider-thumb li .cd-ttl { font-size: 0.77rem; } /* slider travel */ .slider-travel { display: none; } .slider-travel.slick-initialized { display: block; } .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; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .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); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { position: relative; display: none; float: left; height: 100%; max-height: 620px; min-height: 1px; margin: 0 3px; opacity: 0.5; } .slick-slide img { display: block; width: 100%; } .slick-slide p { position: absolute; bottom: 0; left: 0; width: 100%; padding: 5px 10px; font-size: 0.77rem; line-height: 1.25; background: rgba(250, 250, 250, 0.85); } .slick-slide.slick-current { opacity: 1.0; } [dir='rtl'] .slick-slide { float: right; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* Arrows */ .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; z-index: 999; top: 50%; display: block; width: 50px; height: 50px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: #000; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; opacity: 0.3; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; } .slick-prev:before, .slick-next:before { font-family: 'slick'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-prev { left: 0; } [dir='rtl'] .slick-prev { right: 0; left: auto; } .slick-prev:before { content: '←'; } [dir='rtl'] .slick-prev:before { content: '→'; } .slick-next { right: 0; } [dir='rtl'] .slick-next { right: auto; left: 0; } .slick-next:before { content: '→'; } [dir='rtl'] .slick-next:before { content: '←'; } /* Dots */ .slick-dotted.slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; 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 { position: absolute; top: 0; left: 0; width: 10px; height: 10px; content: ''; display: block; border-radius: 100%; text-align: center; opacity: .25; background-color: #000; } .slick-dots li.slick-active button:before { opacity: .75; color: black; } /* other */ .el-info-byeditor { margin-top: 10px; line-height: 1.25; font-size: 0.77rem; } .el-info-byeditor a { color: #006598; } .el-info-byeditor .media-thumb { float: left; width: 50px; margin-right: 15px; } .el-info-bnr { text-align: center; } .el-breakingnews { background-color: #CC0000; } .el-breakingnews .pg-container { position: relative; padding: 35px 50px 10px 15px; font-size: 1rem; line-height: 1.25; } .el-breakingnews .pg-container a { color: #fff; } .el-breakingnews .pg-container::before { position: absolute; content: ""; display: block; content: "BREAKING NEWS"; top: 10px; left: 15px; color: #fff; font-size: 0.77rem; font-weight: bold; } .el-breakingnews .pg-container .btn-breaking-close { position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; background: none; border: none; } .el-breakingnews .pg-container .btn-breaking-close:hover { cursor: pointer; } .el-breakingnews .pg-container .btn-breaking-close::before, .el-breakingnews .pg-container .btn-breaking-close::after { position: absolute; content: ""; display: block; width: 20px; height: 2px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .el-breakingnews .pg-container .btn-breaking-close::after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } /* BREAKING NEWS ------------------------------------------ */ #breakingnews { margin-bottom: 20px; color: #fff; background-color: #0C0C0C; } #breakingnews .pg-container { background-color: #0C0C0C; } #breakingnews .ttl-headline-top a { color: #fff; } #breakingnews .ttl-headline-top a:hover { color: #CC0000; } #breakingnews .cd-ttl-overlay { font-size: 100%; } #breakingnews .list-news-line a { font-size: 0.77rem; color: #fff; } #breakingnews .list-news-line a:hover { color: #CC0000; } /* AD ------------------------------------------ */ .ad-txt { position: relative; clear: both; margin: 10px 0 20px; padding: 15px 0 10px; font-size: 13px; line-height: 1.25; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; min-height:90px; } .ad-txt::before { position: absolute; content: ""; display: block; content: "PR"; top: -7px; left: 0; padding: 0 5px 0 0; font-size: 0.65rem; color: #737373; background-color: #fff; } .ad-txt .ad-txt-txt { position: relative; padding: 0 0 5px 10px; } .ad-txt .ad-txt-txt::before { position: absolute; content: ""; display: block; content: "・"; top: 0; left: 0; font-size: 0.65rem; color: #737373; } .ad-large-top { min-height:180px; } .ad-large-top, .ad-inread { text-align: center; } .ad-large-top > div, .ad-large-top > img, .ad-large-top > iframe .ad-large-top > video, .ad-inread > div, .ad-inread > img, .ad-inread > iframe, .ad-inread > video { padding: 30px 0 0; max-width: 100%; vertical-align: bottom; font-size:0; } .ad-large-top img, .ad-inread img, .ad-inread iframe { width: 100%; vertical-align: bottom; } .bnr-rect { text-align: center; } .pr-list-btm { margin-top: 10px; } .pr-list-btm .txt-source { display: block; margin-top: 5px; } #AAMB13 { line-height: 0; font-size: 0; } /* outbrain */ #related_stories, #related_stories_style { display: none; } /* TOP PARTS ------------------------------------------ */ .pg-container-sidefix .pg-container-side.cb-l2 > div:first-of-type { padding-bottom: 20px; } .category-wrapper .cd .cd-ttl { font-size: 1rem; } .cd .youtube iframe{ width:100%; max-height: 315px; } /* PHOTO ------------------------------------------ */ #pg-photo { color: #fff; background-color: #1A1A1A; } #pg-photo .pg-wrapper .pg-container { background-color: #1A1A1A; } #pg-photo a { color: #fff; } #pg-photo a:hover { color: #CC0000; } #pg-photo #nav-global a { color: #bfbfbf; } #pg-photo .ttl-gray { color: #fff; background-color: #404040; } #pg-photo a.ttl-link i { background-color: #262626; } #pg-photo .list-rank li, #pg-photo .list-news-line li { border-color: #404040; } #pg-photo .pagination li a:hover, #pg-photo .pagination li a.current { color: #CC0000; } #pg-photo .list-service { background-color: #fff; } #pg-photo .list-service li small { color: #0C0C0C; } #pg-photo .slider-main .recommend .cb-l2s2 .cd .media-img .cd-ttl-overlay { color: #fff !important; } #pg-photo .slider-main .slider-nav .slider-nav-prev, #pg-photo .slider-main .slider-nav .slider-nav-next { background-color: transparent; } #pg-photo .slider-main .slider-nav .slider-nav-prev i, #pg-photo .slider-main .slider-nav .slider-nav-next i { border-color: #fff; } #pg-photo .slider-nav .slider-nav-prev, #pg-photo .slider-nav .slider-nav-next { background-color: #1A1A1A; } #pg-photo .slider-nav .slider-nav-prev i, #pg-photo .slider-nav .slider-nav-next i { border-color: #fff; } #pg-photo .slider-nav .slider-nav-prev:hover i, #pg-photo .slider-nav .slider-nav-next:hover i { border-color: #CC0000; } #pg-photo .cd a .cd-ttl-overlay { color: #262626; } #pg-photo .cd a:hover .cd-ttl-overlay { color: #CC0000; } #pg-photo .story-tag li a { color: #595959; } #pg-photo .story-tag li a:hover { color: #CC0000; } #pg-photo .ad-txt { border-color: #bfbfbf; } #pg-photo .ad-txt::before { background-color: #1a1a1a; } #pg-photo .ad-txt a { color: #bfbfbf; } #pg-photo .ad-txt a:hover { color: #CC0000; } /* TOPIC ------------------------------------------ */ .cd .tag span { display: inline-block; float: left; margin: 0 5px 5px 0; padding: 0 5px; font-size: 0.65rem; background-color: #f2f2f2; border: 1px solid #d9d9d9; } .list-tag-link { overflow: hidden; } .list-tag-link li { display: inline; } .list-tag-link li a { display: inline-block; margin: 10px 7px 0 0; padding: 5px 10px; font-size: 0.77rem; border: 1px solid #d9d9d9; } .list-tag-link li a:hover { background-color: #f2f2f2; } .list-timeline { position: relative; overflow: hidden; } .list-timeline::before { position: absolute; content: ""; display: block; top: 0; left: 60px; width: 1px; height: 100%; background-color: #d9d9d9; } .list-timeline dt { width: 50px; float: left; clear: both; color: #737373; font-size: 0.9rem; font-weight: bold; text-align: right; } .list-timeline dd { position: relative; margin-left: 70px; padding-bottom: 15px; font-size: 0.77rem; line-height: 1.25; } .list-timeline dd::after { content: "."; display: block; height: 0; font-size: 0; clear: both; visibility: hidden; } .list-timeline dd a { position: relative; display: block; } .list-timeline dd a::before { position: absolute; content: ""; display: block; top: 10px; left: -15px; width: 10px; height: 10px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #d9d9d9; } .list-timeline dd a:hover::before { background-color: #CC0000; } .list-timeline dd .list-thumb { float: left; width: 100px; margin-right: 10px; } /* QUICK VOTE ------------------------------------------ */ .vote-graph-area { margin: 20px 0; } .vote-graph-area .vote-result { overflow: hidden; margin-bottom: 10px; padding: 5px 20px; font-size: 0.9rem; } .vote-graph-area .vote-result dd { clear: both; float: left; width: 80%; } .vote-graph-area .vote-result.half dt { clear: both; float: left; padding-top: 0; width: 100%; } .vote-graph-area .vote-result.half dd { margin: 0; } .vote-graph-area .vote-result.half dd.percent { clear: none; width: 20%; float: right; text-align: right; } .vote-graph-area .vote-result.on { background-color: #fbf5db; } .vote-graph-area .vote-result .bar { margin-top: 3px; background-color: #dbdbdb; overflow: hidden; } .vote-graph-area .vote-result .bar .indicator { background-color: #CC0000; height: 20px; } .vote-graph-area.vote-graph-foreign { padding: 10px 0 1px; background-color: #f8f8f8; } .vote-graph-area.vote-graph-foreign .bar .indicator { background: transparent url(/media/cnn/images/icons/indicator_blue.png) top left; } .vote-comment-area .comment-box { margin-bottom: 15px; background:url(/load/view.php?a=aHR0cDovL3d3dy5jbm4uY28uanAvbWVkaWEvY25uL2ltYWdlcy9pY29ucy9jb21tZW50X2Fycm93LnBuZw) no-repeat 50px 10px; } .vote-comment-area .comment-box img { width: 48px; float: left; } .vote-comment-area .comment-box .comment { margin-left: 60px; padding: 10px; background-color: #f8f8f8; border-radius: 5px; } .vote-comment-area .comment-box .comment .answer { margin-bottom: 10px; font-weight: bold; } .vote-comment-area .comment-box .comment .answer span { font-weight: normal; margin-left: 10px; } /* STORY PARTS ------------------------------------------ */ article h2 { position: relative; padding: 10px 0 20px; font-size: 1rem; font-weight: bold; line-height: 1.25; } article h2::before { border-top: 1px solid #d9d9d9; content: ""; display: block; height: 1px; margin: 0 0 10px; width: 80px; } article p { padding-bottom: 20px; font-size: 1rem; } article p a { color: #006598; } article .left, article .right, article .center { clear: both; overflow: hidden; margin-bottom: 15px; font-size: 0.77rem; color: #595959; text-align: center; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } article .left img, article .left iframe, article .left video, article .right img, article .right iframe, article .right video, article .center img, article .center iframe, article .center video { max-width: 100%; height: auto; margin: 0 auto 5px; } article .left.img-l, article .right.img-l, article .center.img-l { max-width: 184px; margin: 0 auto 15px; } article .left.img-xl, article .right.img-xl, article .center.img-xl { max-width: 100%; margin: 0 auto 15px; } article .left.img-xxxl, article .right.img-xxxl, article .center.img-xxxl { max-width: 100%; margin: 0 auto 15px; } article .left.video .video-inner, article .right.video .video-inner, article .center.video .video-inner { position: relative; width: 100%; margin-bottom: 10px; padding-top: 56.25%; margin-bottom: 0; } article .left.video .video-inner iframe, article .left.video .video-inner video, article .right.video .video-inner iframe, article .right.video .video-inner video, article .center.video .video-inner iframe, article .center.video .video-inner video { position: absolute; top: -1px; right: -1px; left: -1px; width: 100%; height: calc(100% + 1px); } article .left.video.img-l .video-inner, article .right.video.img-l .video-inner, article .center.video.img-l .video-inner { min-width: 184px; } article .left.video.img-xl .video-inner, article .right.video.img-xl .video-inner, article .center.video.img-xl .video-inner { min-width: 240px; } article .sns {text-align: center;} article .sns > twitterwidget, article .sns > twitter-widget , article .sns > iframe { min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; } article .link-related { position: relative; margin-bottom: 15px; padding: 15px 0 15px 65px; font-weight: bold; line-height: 1.25; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; } article .link-related a { display: inline-block; padding-left: 10px; color: #006598; border-left: 1px solid #d9d9d9; } article .link-related a:hover { color: #CC0000; } article .link-related::before { position: absolute; content: ""; display: block; left: 0; content: "特集"; font-size: 0.77rem; font-weight: normal; line-height: 1.75; color: #737373; } article .link-related.story::before { content: "関連記事"; } .metadata-author, .metadata-updatetime, .caption { color: #737373; font-size: 0.77rem; } .metadata-author i, .metadata-updatetime i, .caption i { padding: 0 5px; } .metadata-author { font-weight: bold; } .story-ttl-line { position: relative; padding: 10px 0 20px; font-size: 1rem; font-weight: bold; line-height: 1.25; } .story-ttl-line::before { border-top: 1px solid #d9d9d9; content: ""; display: block; height: 1px; margin: 0px 0 10px; width: 80px; } .story-media-main img { width: 100%; height: auto; margin-bottom: 10px; } .story-photo-slide p, .story-media-main p { color: #595959; font-size: 100%; padding-bottom: 0; } .story-media-video { position: relative; width: 100%; margin-bottom: 10px; padding-top: 56.25%; } .story-media-video iframe, .story-media-video video { position: absolute; top: -1px; right: -1px; left: -1px; width: 100%; height: calc(100% + 1px); } .story-media-video .story-emb-ttl { padding-top: 10px; } #video_nav .slider-nav-prev, #video_nav .slider-nav-next { height: calc(100% - 45px); } #video_nav .slider-nav-prev i, #video_nav .slider-nav-next i { top: calc(50% + 8.5px); } .story-sns-top, .story-sns-btm { margin-top: 10px; text-align: right; font-size: 0; min-height: 20px; } .story-sns-top li, .story-sns-btm li { display: inline-block; margin-left:5px; } .story-sns-btm { text-align: left; } .story-sns-btm li{ font-size:0; } .story-tag { position: relative; padding-left: 25px; } .story-tag::before { position: absolute; content: ""; display: block; content: "\f02b"; left: 0; font-family: "icon-font"; font-size: 1rem; } .story-tag li { display: inline-block; margin-right: 3px; } .story-tag li a { display: block; padding: 0 5px; color: #595959; font-size: 0.65rem; text-align: center; background-color: #f2f2f2; } .story-tag li a:hover { color: #CC0000; } .story-video-btm, .story-photo-btm, .side-recommend-editor { overflow: hidden; margin-top: 10px; font-size: 0.77rem; } .story-video-btm > div, .story-photo-btm > div, .side-recommend-editor > div { padding-bottom: 20px; } .story-video-btm > div:nth-of-type(odd), .story-video-btm > div:nth-of-type(even), .story-photo-btm > div:nth-of-type(odd), .story-photo-btm > div:nth-of-type(even), .side-recommend-editor > div:nth-of-type(odd), .side-recommend-editor > div:nth-of-type(even) { float: left; width: calc(50% - 10px); } .story-video-btm > div:nth-of-type(odd), .story-photo-btm > div:nth-of-type(odd), .side-recommend-editor > div:nth-of-type(odd) { float: right; } .story-video-btm > div:first-of-type, .story-photo-btm > div:first-of-type, .side-recommend-editor > div:first-of-type { width: 100%; } .story-video-btm .media-img img, .story-photo-btm .media-img img { width: 100%; } .side-recommend-editor > div:nth-of-type(odd) .media-img, .side-recommend-editor > div:nth-of-type(even) .media-img { padding: 0; } .side-recommend-editor > div:nth-of-type(odd) .media-img img, .side-recommend-editor > div:nth-of-type(even) .media-img img { position: static; top: auto; left: auto; width: 100%; height: auto; -webkit-transform: none; transform: none; } .side-recommend-editor > div:nth-of-type(even) { clear: both; } /*overlay 追加 2024_ 0228 ------------------------------------------ */ body.is-no-scroll{ overflow: hidden; height: 100vh; width: 100vw; position: fixed; /* スクロールを完全に停止させる */ } .overlay{ position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0, 0, 0, .7); width: 100%; height:100%; z-index:10000; display: flex; justify-content: center; align-items: center; padding:20px; opacity: 1; transition: opacity 1s ease; /* 透明度の変化に0.5秒かける */ } .overlay:not(.is-show) { opacity: 0; display: none; /* オーバーレイを非表示にする */ transition: opacity 1s ease, display 0s 0.5s; /* 透明度が0になるのに0.5秒、その後にdisplayをnoneに */ } .overlay__inner{ background:#fff; width:calc(100% - 20px); box-shadow: 0 0 120px rgba(0, 0, 0, .7); padding: 20px 0; max-height:calc(100vh - 160px); position:relative; text-align: center; } .overlay__inner-scroll{ overflow: auto; height:100%; padding: 0 20px; } .overlay__button-close { position: absolute; width: 30px; height: 30px; background: #C00015; top:0; right:0; transform: translate(50%, -50%); border-radius:50%; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 0 20px rgba(0, 0, 0, .7); } .overlay__button-close:hover{ width: 40px; height: 40px; } .overlay__button-close:before, .overlay__button-close:after { content: ''; position: absolute; width: 70%; /* 30px */ height: 2px; /* 線の太さ */ background-color: #fff; /* 線の色 */ top: 50%; left: 50%; transform-origin: center; } .overlay__button-close:before { transform: translate(-50%, -50%) rotate(45deg); transition: all 0.3s ease; } .overlay__button-close:after { transform: translate(-50%, -50%) rotate(-45deg); transition: all 0.3s ease; } .overlay__title{ text-align: center; font-weight: bold; font-size: 24px; margin-bottom: 20px; } .overlay__title-logo{ margin-right: 10px; } .overlay__heading{ text-align: center; font-weight: bold; font-size: 28px; margin-bottom: 20px; } .overlay__heading .is-red{ color: #C00015; } .overlay__paragraph p{ font-size: 14px; text-align: left; } .overlay__paragraph p.overlay__paragraph-small { font-size: 12px; } .overlay__form-inner{ padding:20px 0; } .overlay__form-inner .form-register dt, .overlay__form-inner .form-register .ttl-question{ border-top: none; } .overlay__form-inner .form-register .req::before{ position:static; top:auto; left:auto; } .overlay__form-inner .form-register .req{ padding-left: 0; } /* SIDE RIGHT ------------------------------------------ */ .pg-container-side.cb-l2 .cd-ttl strong { font-size: 0.9rem; } .pg-container-side .list-news-line li { font-size: 0.77rem; } /* SEARCH RESULT ------------------------------------------ */ .gsc-result .gs-title { height: auto !important; } .gsc-selected-option-container { max-width: 100% !important; } /* 404 ------------------------------------------ */ #page-error input[type="text"] { min-width: 50%; height: 30px; border-radius: 0; line-height: 30px; font-size: 16px; border: 1px solid #7e9db9; padding: 2px; background-color: #fff; } #page-error input[type="submit"] { display: inline-block; position: relative; cursor: pointer; min-width: 60px; height: 30px; text-align: center; font-weight: bold; background-color: #d9d9d9; vertical-align: top; } /* MEMBER ------------------------------------------ */ /* form parts */ .form-wrapper { width: 100%; max-width: 700px; margin: 0 auto; } .form-register { clear: both; margin-top: 30px; font-size: 0.9rem; } .form-register select, .form-register textarea, .form-register input[type="text"], .form-register input[type="password"], .form-register input[type="datetime"], .form-register input[type="datetime-local"], .form-register input[type="date"], .form-register input[type="month"], .form-register input[type="time"], .form-register input[type="week"], .form-register input[type="number"], .form-register input[type="email"], .form-register input[type="url"], .form-register input[type="search"], .form-register input[type="tel"], .form-register input[type="color"] { width: 100%; padding: 6px; margin-bottom: 10px; font-size: 1rem; line-height: 1.5; vertical-align: middle; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: 1px solid #bbb; background-color: #fff; } .form-register input[type="checkbox"], .form-register input[type="radio"] { width: 20px; height: 20px; -moz-transform-origin: left bottom; -moz-transform: scale(1.2, 1.2); margin-right: 10px; vertical-align: middle; } .form-register input:focus, .form-register select:focus { -webkit-box-shadow: 0 0 5px rgba(4, 156, 219, 0.75); -moz-box-shadow: 0 0 5px rgba(4, 156, 219, 0.75); box-shadow: 0 0 5px rgba(4, 156, 219, 0.75); background-color: #fff; border-color: rgba(4, 156, 219, 0.6); outline: 0; } .form-register input::-webkit-input-placeholder { color: #ccc; } .form-register input:-moz-placeholder { color: #ccc; } .form-register input::-moz-placeholder { color: #ccc; } .form-register input:focus::-webkit-input-placeholder { color: transparent; } .form-register input:focus:-moz-placeholder { color: transparent; } .form-register input:focus::-moz-placeholder { color: transparent; } .form-register textarea:focus::-webkit-input-placeholder { color: transparent; } .form-register textarea:focus:-moz-placeholder { color: transparent; } .form-register textarea:focus::-moz-placeholder { color: transparent; } .form-register option { font-size: 1rem; line-height: 1.5; } .form-register label { font-size: 1rem; margin-right: 30px; } .form-register.cb-gray-round label { font-size: 0.9rem; } .form-register dt, .form-register .ttl-question { clear: both; margin-bottom: 7px; padding: 7px; position: relative; color: #404040; font-size: 0.9rem; font-weight: 700; line-height: 1.375; border-top: 2px solid #737373; background-color: #f2f2f2; } .form-register dt small, .form-register .ttl-question small { display: inline-block; margin-left: 5px; color: #737373; font-size: 0.77rem; font-weight: normal; line-height: 1.25; } .form-register dd { vertical-align: top; } .form-register .req { position: relative; padding-left: 50px; } .form-register .req::before { position: absolute; content: ""; display: block; content: "必須"; top: 10px; left: 5px; color: #CC0000; font-size: 0.65rem; } .form-register.form-register-col2 dd { display: inline-block; width: calc(50% - 10px); margin-right: 15px; } .form-register.form-register-col2 dd:nth-of-type(2) { margin: 0; } .form-register.form-register-col3 dd { display: inline-block; width: calc(33.333% - 10px); margin-right: 10px; } .form-register.form-register-col3 dd:last-of-type { margin: 0; } .form-register.form-register-col3 select { width: calc(100% - 30px); float: left; margin-right: 10px; } .form-register.form-register-postalcode dd { display: inline-block; width: 20%; } .form-register.form-register-postalcode .btn-register-gray { vertical-align: bottom; min-height: 40px; padding: 0 10px; } .form-register .answers table { width: 100%; table-layout: fixed; } .form-register .answers table td { display: block; width: 100%; } .error { color: #CC0000; font-size: 0.77rem; font-weight: bold; } /* button */ .btn-area { padding: 15px 0; text-align: center; } [class^="btn-register"] { display: inline-block; min-width: 40%; min-height: 50px; padding: 10px; color: #fff; font-size: 1rem; text-align: center; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; border: none; cursor: pointer; } [class^="btn-register"]:hover { color: #fff; opacity: 0.8; } .btn-register-blue { background-color: #006598; } .btn-register-red { background-color: #CC0000; } .btn-register-gray { color: #262626; background-color: #bfbfbf; } .btn-register-gray:hover { color: #262626; } .list-btn-mypage a { display: block; padding: 10px 15px; border: 1px solid #d9d9d9; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; } .list-btn-mypage a:hover { background-color: #f2f2f2; } /* register flow */ .register-flow { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } .register-flow li { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: 100%; padding: 5px 10px 5px 5px; font-size: 0.77rem; text-align: center; line-height: 1.25; border: 1px solid #d9d9d9; } .register-flow li::after { position: absolute; content: ""; display: block; right: 5px; top: 50%; margin-top: -7px; font-family: 'icon-font' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f105"; } .register-flow li:last-of-type::after { display: none; } .register-flow li.on { color: #fff; background-color: #0C0C0C; } /* GDPR --------------------------------------------------*/ #gdpr_area { display: none; position: fixed; z-index: 9999; bottom: 0; width: 100%; box-sizing: border-box; background-color: rgba(0, 0, 0, 0.85); color: white; font-size: 12px; line-height: 1.5; } #gdpr_area a { text-decoration: underline; } #gdpr_area .gdpr_area_inner { position: relative; width: 940px; margin: 0 auto; padding: 10px 40px 10px 0; } #gdpr_area .gdpr_area_inner a { color: #fff; } #gdpr_area .gdpr_area_inner a:hover { text-decoration: underline; } #gdpr_area .gdpr_area_inner span.break { display: block; } #gdpr_area .gdpr_btn_agree { cursor: pointer; position: absolute; top: 10px; right: 0; display: block; width: 18px; height: 18px; text-indent: -9999px; background-color: #999; } #gdpr_area .gdpr_btn_agree::after, #gdpr_area .gdpr_btn_agree::before { content: ""; position: absolute; top: 2px; left: 8px; display: block; width: 2px; height: 15px; background-color: #f5f5f5; transform: rotate(45deg); } #gdpr_area .gdpr_btn_agree::before { transform: rotate(-45deg); } @media screen and (max-width: 960px) { #gdpr_area .gdpr_area_inner { width: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 10px 40px 10px 10px; } #gdpr_area .gdpr_area_inner span.break { display: inline; } #gdpr_area .gdpr_btn_agree { right: 10px; } } /*# sourceMappingURL=common.css.map */ .cmertv-pvn-hook{ margin-top:3px; margin-bottom:3px; } /* * browser Control */ html{ overflow-y: scroll; } /* * study english */ #study-english h2::before{ border:none !important } #study-english h2{ font-size: 1.3em; line-height: 1.4em } #study-english h2 small, #study-english h3 small{ margin-left: 10px; font-size: 0.7em; color: #999; } #study-english p{ line-height: 30px; } #study-english dl{ margin-bottom:20px;} #study-english dt{ font-weight: bold; margin-bottom: 5px; margin-top:10px; } #study-english dd{ margin-left: 10px; } #study-english dd.last{ margin-bottom: 20px; } #study-english #document{ margin: 0 20px; padding-bottom: 20px } #study-english .section{ border-top: 2px dotted #bbb; margin-bottom: 15px; } .ee_image{ color: #666; font-size: 12px; text-align: center; padding-bottom:20px; } .ee_video { max-width: 560px; max-height: 315px; margin: auto; }