@charset "UTF-8";
/*
 * reset.css
 * 本ファイルは、CMS管理です。
 *
 * 
*/

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)*/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, 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; font-size: 100%; font: inherit; vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}body { line-height: 1;}ol, ul { list-style: none;}blockquote,q { quotes: none;}blockquote:before,blockquote:after,q:before,q:after { content: ""; content: none;}table { border-collapse: collapse; border-spacing: 0;}/** * Font */@font-face { font-family: "icomoon"; src: url("/common/2022/font/icomoon.eot?snclbq"); src: url("/common/2022/font/icomoon.eot?snclbq#iefix") format("embedded-opentype"), url("/common/2022/font/icomoon.ttf?snclbq") format("truetype"), url("/common/2022/font/icomoon.woff?snclbq") format("woff"), url("/common/2022/font/icomoon.svg?snclbq#icomoon") format("svg"); font-weight: normal; font-style: normal; font-display: block;}/** * Base */html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;}body { color: #333; font-size: 16px; font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; background: #fff; line-height: 1.6; -webkit-print-color-adjust: exact;}@media print { @page { size: A4; margin: 10mm; } body { width: 190mm; }}a { color: #333; line-height: 1.6; text-decoration: none;}@media (max-width: 1300px) { a { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); cursor: pointer; }}h1, h2, h3, h4, h5, h6 { font-weight: normal;}img { vertical-align: bottom; width: auto; height: auto; max-width: 100%;}*:focus { outline: none;}/* 長押し時のハイライト表示を無効化* { -webkit-touch-callout: none; -webkit-user-select: none;} */@media (min-width: 1301px) { .pc { display: block; } .pc_tablet { display: block; } .tablet { display: none; } .sp_tablet { display: none; } .sp { display: none; }}@media (min-width: 769px) and (max-width: 1300px) { .pc { display: none; } .pc_tablet { display: block; } .tablet { display: block; } .sp_tablet { display: block; } .sp { display: none; }}@media (max-width: 768px) { .pc { display: none; } .pc_tablet { display: none; } .tablet { display: none; } .sp_tablet { display: block; } .sp { display: block; }}/** * Loading */.loading { display:none; position: fixed; width: 100%; height: 100%; z-index: 999; background: #f1f1f1; text-align: center;}.loading .logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}.loading .logo img { width: 200px;}.loading .logo .fadeUp { animation-name: fadeUpAnime; animation-duration: 0.5s; animation-fill-mode: forwards; opacity: 0;}@keyframes fadeUpAnime { from { opacity: 0; transform: translateY(100px); } to { opacity: 1; transform: translateY(0); }}/** * Layout Wrap */.l-wrap { position: relative; width: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; overflow: hidden;}.l-wrap_inner { margin: 0 auto; width: 100%; max-width: 1300px; display: flex; justify-content: space-between; align-items: flex-start;}@media (min-width: 769px) and (max-width: 1300px) { .l-wrap_inner { margin: 0 auto; width: 96%; max-width: inherit; max-width: initial; display: flex; justify-content: space-between; align-items: flex-start; }}@media (max-width: 768px) { .l-wrap_inner { width: 100%; max-width: inherit; max-width: initial; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; }}/** * Layout Footer */.l-footer { margin: 64px auto 0;}.c-blockLink { display: inline-block; -webkit-transition: opacity 0.3s ease-in; transition: opacity 0.3s ease-in;}.c-blockLink:hover { opacity: 0.7;}/** * Layout Header */.l-header { z-index: 3; position: relative; left: 0; right: 0; top: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}.l-headerWrapper,.l-footer { width: 100%;}.l-headerWrapper { margin-bottom: 0;/* height: 144px; */ height: 100px;}/*.page_index .l-headerWrapper { margin-bottom: 20px;}*/@media (max-width: 1300px) { .l-headerWrapper { } .page_index .l-headerWrapper { }}@media (max-width: 768px) { .l-headerWrapper {/* height: 95px; */ height: 55px; }}/** * UA */#header-container,#footer-container /*,#link-container01, #link-container02, #link-container03, #link-container04,#link-container05, #link-container06, #link-container07, #link-container08,#link-container09, #link-container10, #link-container11, #link-container12,#link-container13, #link-container14 */{ width: 100%; }/** * Layout Header 01 */.p-header { height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column;}.p-header_main { width: 100%; max-width: 1120px; height: 100px; display: flex; justify-content: space-between; align-items: center;}.p-header_main .site_ttl { width: 340px;}.p-header_main .site_ttl a { display: flex; justify-content: flex-start; align-items: center; flex-direction: row;}.p-header_main .site_ttl .jmag_logo { margin-right: 20px; width: 140px;}.p-header_main .site_ttl p { font-size: 1rem; font-weight: 700; line-height: 1.2; white-space: nowrap;}.p-header_main .top_right { width: 370px; display: flex; justify-content: flex-end; align-items: center; flex-direction: row;}/*.p-header_main .top_right .small_nav { padding: 0 0 18px;}*//* search */.p-header_main .top_right .widget-search { margin-right: 20px; display: inline-block; font-size: 0.75rem; color: #666666; vertical-align: top;}.p-header_main #search { text-align: center;}.p-header_main #search div { width: 100%; display: inline-block; position: relative;}.p-header_main #search input,.p-header_main #search button {/* color: inherit; */ font: inherit; margin: 0; box-sizing: border-box;}.p-header_main #search input[type="text"] { /* width: 254px; */ width: 300px; height: 30px; padding: 0 2.5em 0 1em; line-height: 1.2; border: 1px solid #333; border-radius: 16px; background-color: #f1f1f1; color: #666666;}.p-header_main #search input[type="text" i] { padding-block: 1px; padding-inline: 1rem;}.p-header_main #search button { position: absolute; top: 0; right: 0; display: table-cell; width: 40px; height: 30px; padding: 0; border: 0; background: transparent; opacity: 0.8; cursor: pointer;}.p-header_main #search button img { width: 16px; height: 16px; vertical-align: middle;}/** * Hamburger Menu */.hamb { width: 50px; height: 50px; background-color: #333; border-radius: 50%;}/* Scroll Stop */body:has(.menu-btn:checked ~ .menu) { height: 100%; overflow: hidden;}.hamb .menu-btn:checked ~ .menu { transform: scale(1, 1); transform-origin: right top; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; left: 0; z-index: 30;}.hamb .menu-btn { display: none;}.hamb .menu-icon { display: inline-block; position: relative; cursor: pointer; padding: 24px 12px; -webkit-tap-highlight-color: rgba(255, 255, 255, 1);}.hamb .navicon { background: #fff; display: block; height: 3px; width: 26px; position: relative; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;}.hamb .navicon:before,.hamb .navicon:after { content: ""; display: block; height: 100%; width: 100%; position: absolute; background: #fff; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;}.hamb .navicon:before { top: 9px;}.hamb .navicon:after { bottom: 9px;}.hamb .menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg);}.hamb .menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg);}.hamb .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before { top: 0;}.hamb .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { bottom: 0;}.hamb .menu-btn:checked ~ .menu-icon .navicon { background: rgba(0, 0, 0, 0); transition: 0.2192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;}.hamb .menu-btn:checked ~ .menu a,.hamb .menu-btn:checked ~ .menu li { opacity: 1; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.2s;}.hamb .menu-btn:checked ~ .menu a:hover,.hamb .menu-btn:checked ~ .menu li:hover { opacity: 0.7;}/* Nav items */.hamb .menu { list-style: none; position: absolute; width: 100%; height: 100vh; height: calc(100vh - 100px); top: 0; /* margin-top: 6.67vw; margin-top: 100px; */ margin-top: 90px; /*上から*/ padding: 0 0 10px 0; clear: both; background: rgba(0, 0, 0, 0.8); transition: 1.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; transform: scale(0, 1); transform-origin: right top; left: 150%; z-index: 30;}.hamb .menu .menu_wrap a { opacity: 0; transition: 0.5s;}.hamb .menu .menu_wrap { /* margin-left: 16%; width: 84%;*/ list-style: none; padding: 30px 0 40px; width: 100%; height: calc(100% - 70px); background-color: #f1f1f1; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; overflow-y: scroll;}/* Nav items - Font size */.hamb .menu .nav_ttl { padding-bottom: 10px; width: 900px; font-size: 1.25rem; color: #e6371d; font-weight: 700;}.hamb .menu ul.menu_list,.hamb .menu ul.menu_tag,.hamb .menu ul.menu_other,.hamb .menu ul.menu_aside { margin-bottom: 20px; padding-bottom: 20px; width: 900px; list-style: none; border-bottom: 2px solid #fff;}.hamb .menu ul.menu_list { display: flex; justify-content: space-between; align-items: stretch; flex-direction: row; flex-wrap: wrap;}.hamb .menu ul.menu_list li { padding: 8px 0; width: 33%; font-size: 1.5rem; font-weight: 700; text-align: left;}.hamb .menu ul.menu_tag { display: flex; justify-content: flex-start; align-items: center; flex-direction: row; flex-wrap: wrap;}.hamb .menu ul.menu_tag li { margin-right: 2em; padding: 8px 0; width: auto; font-size: 1.25rem; font-weight: 700; text-align: left;}.hamb .menu ul.menu_other { display: flex; justify-content: flex-start; align-items: center; flex-direction: column;}.hamb .menu ul.menu_other li { padding: 8px 0; width: 100%; font-size: 3.2vw; font-size: 1.5rem; font-weight: 700; text-align: left;}.hamb .menu ul.menu_aside { padding-bottom: 0; border: none; display: flex; justify-content: flex-start; align-items: center; flex-direction: row;}.hamb .menu ul.menu_aside li { margin-right: 2em; padding: 8px 0; width: auto; font-size: 1rem; font-weight: 700; text-align: left;}.hamb .menu ul.menu_aside li a { color: #999;}.hamb .menu .outerlink { position: relative;}.hamb .menu .outerlink::after { content: ""; display: inline-block; width: 1em; height: 1em; background: url(/assets/images/common/icon_blank.svg) no-repeat; background-size: contain; background-position: center bottom; margin-left: 8px;}.hamb .small_logo { margin: 0 auto; width: 140px; text-align: center; line-height: 1;}.hamb .small_logo a { margin-bottom:40px; width: 100%; display: block;}.hamb .small_logo p.lead { padding: 10px 0; font-size: 7.4px; font-weight: 500;}.hamb .menu ul a:hover { opacity: 0.7;}/* スクロールするなら *//*.hamb .menu .menu_wrap { padding: 30px 0 ; display: block; overflow-y: scroll; display: grid; place-items: center; align-content: center; } */.hamb .small_logo img { vertical-align: bottom;}@media (min-width: 769px) and (max-width: 1300px) { .hamb .menu .nav_ttl { margin-left: 5%; margin-right: 5%; width: 90%; } .hamb .menu ul.menu_list, .hamb .menu ul.menu_tag, .hamb .menu ul.menu_other, .hamb .menu ul.menu_aside { margin-left: 5%; margin-right: 5%; margin-bottom: 15px; padding-bottom: 15px; width: 90%; } .hamb .menu ul.menu_list li { padding: 5px 0; width: 50%; font-size: 1.5rem; } .hamb .menu ul.menu_tag li { padding: 5px 0; font-size: 1.25rem; } .hamb .menu ul.menu_other li { padding: 5px 0; font-size: 1.5rem; } .hamb .menu ul.menu_aside li { padding: 5px 0; font-size: 1rem; }}@media (max-width: 768px) { .hamb .menu { height: calc(100vh - 50px); margin-top: 50px; } /* スクロールするなら .hamb .menu .menu_wrap { padding: 30px 0; display: block; overflow-y: scroll; }.hamb .small_logo img { margin-bottom: 100px;} */ .hamb .menu .nav_ttl { margin-left: 5%; margin-right: 5%; padding-bottom: 0; width: 90%; font-size: min(3.73vw, 28px); } .hamb .menu ul.menu_list, .hamb .menu ul.menu_tag, .hamb .menu ul.menu_other, .hamb .menu ul.menu_aside { margin-left: 5%; margin-right: 5%; margin-bottom: 8px; padding-bottom: 8px; width: 90%; } .hamb .menu ul.menu_aside { align-items: flex-start; flex-direction: column; } .hamb .menu ul.menu_list li { padding: 2px 0; width: 50%; font-size: min(4.53vw, 1.5rem); } .hamb .menu ul.menu_tag li { padding: 2px 0; font-size: min(4vw, 1.25rem); } .hamb .menu ul.menu_other li { padding: 2px 0; font-size: min(4.53vw, 1.5rem); } .hamb .menu ul.menu_aside li { margin-right: 1.6em; padding: 2px 0; font-size: min(3.46vw, 1rem); }}/** * Layout Header 02 */.p-header_sub { width: 100%;/* height: 44px; */ height: auto; background-color: #e6371d; display: flex; justify-content: center; align-items: center;}.p-header_sub .navlink { width: 100%; max-width: 1120px;}.p-header_sub ul { width: 100%; display: flex; align-items: stretch; background-color: #e6371d;}.p-header_sub ul li { padding: 0; flex-grow: 1; text-align: center;}.p-header_sub ul li a { font-size: 0.875rem; font-weight: 500; line-height: 1.3; color: #fff; width: 100%; height: 44px; display: grid; place-items: center;}.p-header_sub ul li.active { background-color: #9f1b07;}.p-header_sub ul li + li { position: relative;}.p-header_sub ul li + li::after { content: ""; width: 1px; height: 10px; background-color: #fff; position: absolute; top: calc(50% - 5px); left: 0;}/** * Topic Path */.p-header_path { padding: 1em 0; width: 100%; display: flex; justify-content: center; align-items: center;}.p-header_path ul { width: 100%; max-width: 1120px; display: flex; justify-content: flex-start; align-items: center;}.p-header_path ul li { margin-right: 4em; font-size: 0.75rem; line-height: 1.6; display: inline-block; position: relative;}.p-header_path ul li::after { content: ""; width: 8px; height: 8px; border: 0; border-top: solid 1px #333; border-right: solid 1px #333; transform: rotate(45deg); position: absolute; top: 0; right: -2em; bottom: 0; margin: auto;}.p-header_path ul li:last-child { margin-right: 0;}.p-header_path ul li:last-child:after { content: none;}.p-header_path ul li a { font-weight: 700;}@media (max-width: 1300px) { .p-header_sub .navlink { width: 100%; max-width: auto; overflow-x: auto; } .p-header_sub ul { margin: 0 auto;/* width: 100%; */ width: max-content; display: flex; align-items: stretch; } .p-header_sub ul li a { height: 44px; } .p-header_path { margin: 0 2%; width: 96%; }}@media (max-width: 768px) { .p-header_path ul { width: 100%; max-width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .p-header_path ul li { padding: 0.3em 0; }}@media (min-width: 769px) and (max-width: 1300px) { /** * Layout Header 01 */ .p-header_main { margin: 0 auto; width: 96%; max-width: inherit; max-width: initial; height: 100px; display: flex; justify-content: space-between; align-items: center; } .p-header_main .top_right { width: 30.9vw; } .p-header_main #search input[type="text"] { width: 25vw; } /** * Hamburger Menu - content */ .nav_ttl { font-size: 4.8vw; } /** * Layout Header 02 */ .p-header_sub ul li { padding: 0 1em; } /* .p-header_sub ul li a { font-size: 3.2vw; }*/}@media (max-width: 768px) { /** * Layout Header 01 */ .p-header_main { margin: 0 auto; width: 94%; max-width: inherit; max-width: initial; height: 50px; } .p-header_main .site_ttl { width: auto; max-width: 59vw; } .p-header_main .site_ttl .jmag_logo { margin-right: 10px; width: auto; max-height: 40px;/* width: 21.33vw; max-height: 5.33vw;*/ } .p-header_main .site_ttl p { font-size: min(3.2vw, 0.75rem); } .p-header_main .top_right { width: 22vw;/* position: relative; */ } .p-header_main .top_right .widget-search {/* width: 26px; height: 26px; */ position: relative; } /* .float-search { width: 26px; height: 26px; display: grid; place-items: center; } */ .float-search { width:26px; min-width: 26px; max-width:200px; display: grid; place-items: center end; background: #ededed; } .float-search details { z-index: 40; width:26px; position:absolute; top: 0; right: 0; } .float-search details summary { list-style: none; height: 32px; text-align: right; } .float-search details summary::-webkit-details-marker { display: none;} .float-search details summary img { cursor: pointer; width: 26px; height: 26px; } .float-search details[open] { margin-top: 0; width:48vw; max-width:200px; border-radius: 0 0 18px 18px; background: rgba(255,255,255,0.7); } .float-search details[open] .details-content { margin:0 6px 6px; width:calc(100% - 12px); animation: fadeIn 0.5s ease;}@keyframes fadeIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: none; }} .p-header_main .float-search details #search input[type="text"] { width:100%; } /** * Hamburger Menu */ .hamb { width: 35px; height: 35px; } .hamb .menu-icon { padding: 16px 7px; } .hamb .navicon { height: 3px; width: 21px; } .hamb .navicon:before { top: 7px; } .hamb .navicon:after { bottom: 7px; } /* Nav items */ .hamb .menu { margin-top: 50px; } /** * Hamburger Menu - content */ .nav_ttl { font-size: 4.8vw; } /** * Layout Header 02 */ .p-header_sub { width: 100%;/* height: 40px; */ height: auto;/* 後で消す position: absolute; top: 55px; z-index: auto;*/ } .p-header_sub ul li { padding: 0 1em; } .p-header_sub ul li a { height: 40px; }}/* 2024-11 nav and topic_path *//* ナビだけ固定：ヘッダ全体固定のため、ここから.p-header_sub.transform { position: fixed; top: 0; z-index: 28;}.page_index.jac .l-wrap_inner { margin-top: 0;}.jac .l-wrap_inner { margin-top: 55px;}.jac .p-header_path {height: 8px;}.jac .p-header_path ul {display:none;} ここまでを退避 *//* 2024-11 nav and topic_path *//* ヘッダ全体固定 */#header-container { position: fixed; top: 0; z-index: 20; background-color: #fff; height: 100px;}.p-header_sub { position: fixed; top: 100px; z-index: 19;}.l-wrap {padding-top: 145px;}.l-wrap_inner { margin-top: 0;}.jac #header-container { height: 0px;}.jac .p-header_sub { top: 0;}.jac .l-wrap {padding-top: 55px;}/* index.css から強制で上書き */.jac .l-wrap_slider { margin-top: 10px !important;}@media (min-width: 769px) and (max-width: 1300px) {}@media (max-width: 768px) { #header-container { height: 50px; } .p-header_sub { top: 50px; } .l-wrap {padding-top: 95px;}}.jac .p-header_path {height: 8px; padding: 0;}.jac .p-header_path ul {display:none;}/* L512 */.hamb .menu { height: calc(100vh - 145px); margin-top: 145px; /*上から*/}/* L712 */@media (max-width: 768px) { .hamb .menu { height: calc(100vh - 95px); margin-top: 95px; }}