/* reset ----------------------------------- */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, var, b, dl, dt, dd, ol, ul, li, i, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-weight:400; background:transparent; font-style:normal; } body { line-height:1; } article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section { display:block; } nav ul { list-style:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } a { margin:0; padding:0; vertical-align:baseline; background:transparent; text-decoration: none; color: #171717; } table { border-collapse:collapse; border-spacing:0; } hr { display:block; height:1px; border:0; border-top:1px solid #ddd; margin:1em 0; padding:0; } input, select { vertical-align:middle; } * { box-sizing: border-box; } /* end_reset ----------------------------------- */ #header-2021, #footer-2021 { color:#171717; line-height:1; padding: 0; position: relative; text-align: center; font-family: neue-haas-grotesk-text, "Helvetica Neue", Helvetica, Arial, noto-sans-cjk-jp, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif !important; font-size: 15px; letter-spacing: 0.08em; line-height: 1; font-weight: 400; -webkit-font-smoothing: antialiased; } html { min-height: 100%; overflow-y: scroll; } /* !clearfix */ .cfix:after { content: ""; display: block; clear: both; } .cfix:before { content: ""; display: block; clear: both; } .cfix { display: block; } /* !Links */ #header-2021 a, #footer-2021-2021 a { cursor: pointer } #header-2021 a:link { color: #171717; text-decoration: none; } #header-2021 a:visited { color: #171717; text-decoration: none } #header-2021 a:hover { color: #a7a7a7; text-decoration: none; } #header-2021 a:active { color: #000; text-decoration: none } #header-2021 a.nb:link { border-bottom: none } .wrapper-2021 { position: relative; width: 100%; z-index: 10; text-align: center; margin-top: 72px } #header-2021 { position: fixed; left: 0; top: 0; width: 100%; height: 72px; background: transparent; text-align: left; z-index: 10000; min-width: 1040px; background: rgba(255,255,255,0.95) } #header-2021 h1 { position: relative; padding: 15px 0 0 50px; width: 172px; z-index: 10;box-sizing: content-box; border-bottom:0;margin-top: 0; } #header-2021 #global-nav { position: absolute; right: 280px; top: 3px; margin-right: 0; } #header-2021 #global-nav ul { list-style: none; margin: 0;} #header-2021 #global-nav li { position: relative; float: left } #header-2021 #global-nav li a { display: block; padding: 25px; line-height: 1em; position: relative } #header-2021 #global-nav li a p { position: relative; z-index: 10; font-size: 15px; font-weight: 500; letter-spacing: 0.06em; line-height: 1em; margin:0;} #header-2021 #global-nav li .mm-tri { position: absolute; left: 0; bottom: -3px; width: 100%;height: 8px; background: url(/ja/images/index2/mm_tri.png) no-repeat center; background-size: contain; display: none; z-index: 0 } #header-2021 #global-nav li.cur a p { /*background: #000;*/ color: #000; line-height: 1.5em; padding: 0 0.2em } #header-2021 #global-nav li a span { position: absolute; display: block; left: 0; top: 9px; width: 100%; height: 48px; background: #ff8500; border-radius: 22px; z-index: 0; display: none } @media screen and (max-width: 1580px){ #header-2021 h1 { padding: 15px 0 0 20px; } #header-2021 #global-nav li a { padding: 25px 15px; } } #header-2021 #mega-menu { position: absolute; left: 0; top: 72px; width: 100% } #header-2021 #mega-menu .mm { position: absolute; left: 0; top: 0; width: 100%; background: #fff; border-top: solid 1px #dedede; display: none } #header-2021 #mega-menu .mm .mm-inner { padding: 40px 11.6vw } #header-2021 #mega-menu .mm .mm-inner .m-menu { float: left; width: 25% } #header-2021 #mega-menu .mm .mm-inner .m-menu ul { padding: 0.5em 1em 1em; border-left: solid 1px #dedede; margin-bottom: 2em; list-style: none; } #header-2021 #mega-menu .mm .mm-inner .m-menu ul:last-child { margin-bottom: 0 } #header-2021 #mega-menu .mm .mm-inner .m-menu ul li a, #header-2021 #mega-menu .mm .mm-inner .m-menu ul li span { display: block; font-weight: 500; font-size: 14px; line-height: 1.8em; padding: 0.5em 0 } #header-2021 #mega-menu .mm .mm-inner .m-menu ul li ol { padding: 0; list-style: none; } #header-2021 #mega-menu .mm .mm-inner .m-menu ul li ol li a { display: block; font-weight: 400; padding: 0.25em 0 0.25em 1em; font-size: 13px; } #header-2021 #mega-menu .mm .mm-inner .m-menu p { margin-top: 1em } #header-2021 #mega-menu .mm .mm-inner .m-menu p span { font-weight: 500 } #header-2021 #mega-menu .mm.mm05 .mm-inner .m-menu { } #header-2021 #mega-menu .mm.mm07 .mm-inner .m-menu { } #header-2021 #mega-menu .mm.mm07 .mm-inner .m-menu ul li a { font-size: 14px; padding-bottom:0; } .mmWrap ol { float: left; margin-right: 2em } .mm-btn { padding-right: 2em } .mm-btn a { position: relative; display: block; padding: 1em; ; border: solid 1px #a9a9a9; text-align: center; font-weight: 700;background:url(/ja/images/index2/arw01.png) #f7f7f7 1em 50% / 10px 6px no-repeat } .mm-btn a:hover { color:#fff!important; border: solid 1px #ff8500; background: url(/ja/images/index2/arw00.png) #ff8500 1em 50% / 10px 6px no-repeat; }.mm-btn a .arw { position: absolute; left: 1em; top: 50%; margin-top: -3px } .mm .bnr-logo { text-align: center; display: block; margin: -20px 0 0; padding: 0 0 40px } #btn-en { position: absolute; right: 90px; top: 14px; background: #f7f7f7; line-height: 1em; font-size: 15px; border-radius: 22px } #btn-en a { display: block; padding: 16px 24px 16px 48px; font-weight: 500 } #btn-en a .arw { position: absolute; left: 20px; top: 50%; margin-top: -3px } #btn-search { position: absolute; right: 25px; top: 13px; height: 45px; z-index: 10 } #btn-search a { position: absolute; display: block; right: 0; top: 0; width: 45px; height: 45px; background: #ff8500; border-radius: 22px 22px 22px 0px; z-index: 10; padding: 15px; box-sizing: border-box; } #btn-search a:before { content: "\f002"; font-family: FontAwesome; color: #fff; } #btn-search .search-form { position: absolute; right: 0; top: 0; width: 250px; height: 45px; border-radius: 22px; background: #ff8500; z-index: 20; display: none } #btn-search .search-form input { margin: 0; border-radius: 12px; border: none; padding: 0 10px; width: 190px; border-radius: 20px !important; font-family : inherit; font-size : 100%; } #btn-search .search-form input:focus { outline: none; } #SS_searchSubmit { display: none } #header-2021 #sp-menu { display: none } #cvr { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.25); z-index: 9999; display: none } div[class^="acto-btn3"], div[class^="actr-btn3"], div[class^="act-btn3"], div[class^="actv-btn3"] { width: 31%; margin: 0 auto; } div[class^="acto-btn5"], div[class^="actr-btn5"], div[class^="act-btn5"], div[class^="actv-btn5"] { width: 50%; margin: 0 auto; } div[class^="acto-btn7"], div[class^="actr-btn7"], div[class^="act-btn7"], div[class^="actv-btn7"] { width: 75%; margin: 0 auto; } div[class^="acto-btn10"], div[class^="actr-btn10"], div[class^="act-btn10"], div[class^="actv-btn10"] { width: 100%; margin: 0 auto; } div[class^="acto-btn"] a, div[class^="actr-btn"] a, div[class^="act-btn"] a, div[class^="actv-btn"] a { position: relative; display: block; padding: 1em; margin: 1rem auto; background: #f7f7f7; border-radius: 20px; box-shadow: 1px 1px 1px 1px #efefef; line-height: 1.3rem; text-align: center; color: #444; font-size: 0.9375rem } div[class^="acto-btn"] a:hover, div[class^="actr-btn"] a:hover, div[class^="act-btn"] a:hover, div[class^="actv-btn"] a:hover { opacity: 0.7; } div[class^="acto-btn"] a .arw, div[class^="actr-btn"] a .arw, div[class^="act-btn"] a .arw, div[class^="actv-btn"] a .arw { position: absolute; left: 20px; top: 50%; margin-top: -3px; } .acto-btn3-h a,.acto-btn5-h a,.acto-btn7-h a,.acto-btn10-h a { background: #ff8500!important; color: #fff!important; } .actr-btn3-h a,.actr-btn5-h a,.actr-btn7-h a,.actr-btn10-h a { background: #f9452d!important; color: #fff!important; } .actv-btn3-h a,.actv-btn5-h a,.actv-btn7-h a,.actv-btn10-h a { background: #7c61ff!important; color: #fff!important; } .act-btn3-h a,.act-btn5-h a,.act-btn7-h a,.act-btn10-h a { background: #1bbcfe!important; color: #fff!important; } #footer-2021 { border-top: solid 1px #dedede; margin-top: 100px; } #footer-2021 .foot { padding: 60px 11.6vw 0 } #footer-2021 .foot .privacy { position: relative; padding: 0 120px 20px 0; } #footer-2021 .foot .privacy .privacy-inner { text-align: left; } #footer-2021 .foot .privacy .privacy-inner .cont { float: left; width: 50%; margin-right: 2%; min-height: 90px } #footer-2021 .foot .privacy .privacy-inner .cont:last-child { width: 46%; margin-right: 0 } #footer-2021 .foot .privacy .privacy-inner .cont img { float: left; margin-right: 1em } #footer-2021 .foot .privacy .privacy-inner .cont p { font-size: 10px; line-height: 1.6em; margin: 0 !important } #footer-2021 .foot .privacy .pmark { position: absolute; right: 0; top: 0 } #footer-2021 .foot .service-logos { padding: 30px 0; border-top: solid 1px #dedede; display: flex; justify-content: center; } #footer-2021 .foot .service-logos a { margin: 0 1em; display: flex; flex-direction: column; gap: 10px; flex-basis: 250px; } #footer-2021 .foot .service-logos a figure { display: flex; align-items: start; justify-content: center; height: 46px; } #footer-2021 .foot .service-logos a span { font-size: 0.85em; text-align: center; } #footer-2021 .footer-inner { position: relative; padding: 60px 11.6vw 40px; text-align: left; background: #000 } #footer-2021 .footer-inner h1 { width: 200px; border-bottom:0; padding: 0; } #footer-2021 .footer-inner { position: relative; padding: 60px 11.6vw 40px; text-align: left; background: #000 } #footer-2021 .footer-inner h1 { width: 200px; border-bottom:0; padding:0; } #footer-2021 #fnav { margin-top: 40px } #footer-2021 #fnav .links { float: left; width: 28% } #footer-2021 #fnav .links:last-child { width: 16% } #footer-2021 #fnav .links a:link { color: #c6c6c6; text-decoration: none; } #footer-2021 #fnav .links a:visited { color: #c6c6c6; text-decoration: none } #footer-2021 #fnav .links a:hover { color: #f6f6f6; text-decoration: none; } #footer-2021 #fnav .links a:active { color: #000; text-decoration: none } #footer-2021 #fnav .links ul { padding-bottom: 1em; margin-left: 1em; list-style: none; padding-left:0; } #footer-2021 #fnav .links ul li { font-weight: 500; font-size: 14px; line-height: 1.8em; padding: 0.5em 0; color: #c6c6c6} #footer-2021 #fnav .links ul li ul li { font-weight: 400; font-size: 13px; } #footer-2021 #fnav .links a.tit { font-weight: 700 !important; font-size: 15px !important; padding: 0.5em 0 1em !important; display: block } #footer-2021 .copyright { position: relative; width: 100%; color: #fff; margin-top: 2em; font-weight: 700 } #gotopt { position: fixed; right: 50px; bottom: 50px; cursor: pointer; z-index: 999; } .pc-none { display: none } .sp-none { display: block } @media screen and (max-width: 1400px){ #header-2021 { height: 72px } #header-2021 h1 { position: relative; padding: 15px 20px; width: 172px } #header-2021 #global-nav { display: none } #header-2021 #mega-menu { display: none } #header-2021 #btn-contact { display: none } #header-2021 #btn-en { display: none } #header-2021 #btn-search { display: none } #header-2021 #menu-btn { position: fixed; right: 0; top: 0; width: 50px; height: 50px; z-index: 1000; cursor: pointer } #header-2021 #menu-btn span.ln1 { position: absolute; left: 50%; top: 50%; margin: -4px 0 0 -25%; width: 50%; height: 2px; background: #ff8500 } #header-2021 #menu-btn span.ln2 { position: absolute; left: 50%; top: 50%; margin: 4px 0 0 -25%; width: 50%; height: 2px; background: #f9452d } #header-2021 #sp-menu { display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(255,255,255,0.95); overflow-y: scroll; z-index: 0 } #header-2021 #sp-menu .spmenu-inner { padding: 70px 0 5.8vw } #header-2021 #sp-menu .spmenu-inner ul { border-top: solid 1px #dedede; padding-inline-start:0; } #header-2021 #sp-menu .spmenu-inner li { border-bottom: solid 1px #dedede } #header-2021 #sp-menu .spmenu-inner li a { display: block; padding: 1.5em 5.8vw; font-size: 14px; font-weight: 500; position: relative } #header-2021 #sp-menu .spmenu-inner li a.ac .plus { position: absolute; right: 5.8vw; top: 50%; margin-top: -10px; font-size: 20px; color: #f9452d } #header-2021 #sp-menu .spmenu-inner li ol { display: none; padding: 0 5.8vw 1em; list-style: none; } #header-2021 #sp-menu .spmenu-inner li ol li { border-bottom: none; border-left: solid 1px #dedede } #header-2021 #sp-menu .spmenu-inner li ol li a { padding: 1em 5.8vw; font-size: 13px; } #header-2021 #sp-menu .spmenu-inner li ol li.ch a { padding: 1em 5.8vw 1em 8vw; font-size: 13px; font-weight: 400 } #header-2021 #sp-menu .spmenu-inner .link-en { background: #f7f7f7; line-height: 1em; font-size: 14px; border-radius: 22px; margin: 15px 5.8vw; position: relative; } #header-2021 #sp-menu .spmenu-inner .link-en a { position: relative; display: block; padding: 14px 0; font-weight: 500; text-align: center } #header-2021 #sp-menu .spmenu-inner .link-en a .arw { position: absolute; left: 20px; top: 50%; margin-top: -3px } #header-2021 #sp-menu .spmenu-inner .search-form-sp { padding: 0 5.8vw; position: relative } #header-2021 #sp-menu .spmenu-inner .search-form-sp input { margin: 0; border-radius: 15px 0 0 15px; border: solid 1px #dedede; padding: 0.5rem 1em; width: 100%; font-size: 15px; } #header-2021 #sp-menu .spmenu-inner .search-form-sp #SS_searchSubmit { display: block; position: absolute; right: 5.8vw; top: 0; width: 44px; height: 44px; background: url(/ja/images/index2/btn_seach.png) no-repeat; background-size: contain; text-indent: -1000em; border: none; border-radius: 0 } #header-2021 #sp-menu .bnr-logo { text-align: center; display: block; margin: 15px 0 0; padding: 0 } } @media screen and (max-width: 768px){ .wrapper-2021 { margin-top: 50px } #header-2021, #footer-2021 { font-size: 13px; letter-spacing: 0.08em; } #header-2021 { height: 50px; min-width: inherit } #header-2021 h1 { position: relative; padding: 10px 20px; width: 120px } #header-2021 #sp-menu .spmenu-inner { padding: 50px 0 5.8vw } div[class^="acto-btn"], div[class^="actr-btn"], div[class^="act-btn"], div[class^="actv-btn"] { width: 100%; margin: 0 auto; } #footer-2021 { } #footer-2021 .foot { padding: 30px 5.8vw 0 } #footer-2021 .foot .privacy { position: relative; padding: 0 0 15px; } #footer-2021 .foot .privacy img { height: 64px } #footer-2021 .foot .privacy .privacy-inner { text-align: left; } #footer-2021 .foot .privacy .privacy-inner .cont { float: none; width: 100%; margin-right: 0; margin-bottom: 20px; min-height: inherit } #footer-2021 .foot .privacy .privacy-inner .cont:last-child { width: 100%; margin: 0 0 20px } #footer-2021 .foot .privacy .privacy-inner .cont img { float: left; margin: 0 1em 6px 0 } #footer-2021 .foot .privacy .privacy-inner .cont p { font-size: 9px; line-height: 1.6em; margin: 0 } #footer-2021 .foot .privacy .pmark { position: relative; right: inherit; top: inherit } #footer-2021 .foot .service-logos { padding: 20px 0; border-top: solid 1px #dedede; flex-direction: column; gap: 15px; } #footer-2021 .foot .service-logos a { margin: 0 1em; flex-basis: auto; gap: 5px; } #footer-2021 .foot .service-logos a:first-child figure, #footer-2021 .foot .service-logos a:first-child figure img { height: 26px; } #footer-2021 .foot .service-logos a:nth-of-type(2) figure, #footer-2021 .foot .service-logos a:nth-of-type(2) figure img { height: 40px; } #footer-2021 .footer-inner { position: relative; padding: 30px 11.6vw 20px; text-align: left; background: #000 } #footer-2021 .footer-inner h1 { width: 120px } #footer-2021 #fnav { margin-top: 30px } #footer-2021 #fnav .links { float: none; width: 100%; } #footer-2021 #fnav .links:first-child { width: 100%; display: block } #footer-2021 #fnav .links { display: none; } #footer-2021 #fnav .links a.tit { font-weight: 700 !important; font-size: 13px !important; padding: 0 0 1em !important; display: block } #footer-2021 .copyright { position: relative; width: 100%; color: #fff; margin-top: 2em; font-weight: 700 } #gotopt { position: fixed; right: 10px; bottom: 10px; cursor: pointer } #gotopt img { height: 40px } .br:before { content: "" ; white-space: pre ; } .pc-none { display: block } .sp-none { display: none } } @media screen and (max-width: 375px){ #header #sp-menu .spmenu-inner .search-form-sp input { width: 100% } } @media screen and (max-width: 320px){ #header #sp-menu .spmenu-inner .search-form-sp input { width: 100% } } a.link-disabled { pointer-events: none; } /********************* marsFinder **********************/ .search-form .mf_finder_container{ margin: 0; } .search-form .mf_finder_searchBox_items, .search-form .mf-search-bar_input-wrapper { padding: 5.5px 1px !important; width: 185px; margin: 0 auto 0 0; } .search-form .mf_finder_searchBox, .search-form .mf-search-bar { margin-left: 5px !important; } .search-form .mf-search-bar { margin-right: 1rem; } .search-form .mf_finder_searchBox_query_input { height: 1rem !important; } .search-form .mf_finder_searchBox_query_wrap { width: 185px !important; } .search-form .mf_finder_searchBox_query_wrap ul { display:none; } .search-form .mf_finder_searchBox_submit, .search-form .mf-search-bar_input_alt-btn { background-color: #ff8500 !important; padding: 0 0 0 25px !important; color: #fff !important; } .search-form .mf-search-bar_input_alt-btn::before, .search-form-sp .mf-search-bar_input_alt-btn::before { color: #fff; content: "\f002"; font-family: FontAwesome; } .search-form .mf-search-bar_input { position: relative; z-index: 1; } .search-form-sp .mf-search-bar_input { border-radius: 4px 0 0 4px !important; border-right: 0 !important; } .search-form-sp .mf_finder_container{ margin: 0; width: 100%; } .search-form-sp .mf_finder_searchBox, .search-form-sp .mf-search-bar { margin-left: 0 !important; margin-right: 0 !important; } .search-form-sp .mf_finder_searchBox_items, .search-form-sp .mf-search-bar_input-wrapper { width: 100% !important; } .search-form-sp .mf_finder_searchBox_submit, .search-form-sp .mf-search-bar_input_alt-btn { background-color: #ff8500 !important; padding: 0 20px; border-radius: 0 15px 15px 0; color:#fff; width: 100%; height: 100%; } .search-form-sp .mf_finder_searchBox_submit span, .search-form-sp .mf-search-bar_input_alt-btn svg, .search-form .mf-search-bar_input_alt-btn svg { display: none; } .search-form-sp .mf_finder_searchBox_query_wrap ul { display:none; } .search-form-sp .mf-search-box .mf-search-bar .mf-search-bar_input-buttons { flex-shrink: 0; height: 35px; padding: 0; width: 55px; position: static; } .search-form .mf-search-box {padding: 0 !important;} /********************* common_style **********************/ main { position: relative; width: 100%; margin-top: 72px; } .contents { color: #171717; text-align: center; font-family: neue-haas-grotesk-text, "Helvetica Neue", Helvetica, Arial, noto-sans-cjk-jp, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif !important; font-size: 16px; letter-spacing: 0.05em; line-height: 2em; font-weight: 400; -webkit-font-smoothing: antialiased; margin-top: 72px; padding: 0 0 11.6vw; overflow: hidden; } .contents p { margin-bottom: 1.5rem; } section.g3 { width: 100%; padding: 0 4vw; max-width: 1200px; margin: 0 auto 80px auto; text-align: left; } main a:hover { opacity: 0.8; transition:0.3s all; } .brand_bpo {padding: 100px 0!important; margin-bottom: 0!important; } .brand_bpo a { display: inline-block; border-radius: 16px; overflow: hidden; box-shadow: 1px 3px 10px 0.5px rgb(0 0 0 / 10%); transition-property: opacity; transition-duration: 0.5s; } .brand_bpo a:hover { opacity: 0.7; } @media screen and (max-width:768px) { .brand_bpo {padding: 10px 15px 30px!important; } } section.gray_bg { width: 100%; max-width: none; background-color: #f7f7f7; padding: 80px 0; margin-bottom:80px; } section .gray_box { width: 100%; padding: 30px 40px; background-color: #f7f7f7; } section .gray_boxs { width: 100%; padding: 10px 15px; background-color: #f7f7f7; display: inline-block;} section .gray_box_r { width: 100%; padding: 30px 40px; background-color: #f7f7f7; border-radius: 20px; } section .gray_boxs_r { width: 100%; padding: 10px 15px; background-color: #f7f7f7; border-radius: 15px; } section .gray_bdr { width: 100%; padding: 30px 40px; border: 1px #ccc solid; border-radius: 20px; background-color: #fff; } section .gray_bdrs { width: 100%; padding: 10px 15px; border: 1px #ccc solid; border-radius: 15px; background-color: #fff; } section .gray_bdr_deco { width: 100%; background-image: url(/ja/images/index2/bg001.png); padding: 8px; border-radius: 20px; background-color: #fff; } section .gray_bdr_deco div { background-color: #fff; padding: 30px 40px; border-radius: 12px; } section .gray_bdrs_deco { width: 100%; background-image: url(/ja/images/index2/bg001.png); padding: 8px; border-radius: 20px; background-color: #fff; } section .gray_bdrs_deco div { background-color: #fff; padding: 10px 15px; border-radius: 12px; } [class^="gray_"] p:last-child, [class^="gray_"] ul, [class^="gray_"] ol { margin-bottom: 0; } @media screen and (max-width:768px) { section.gray_bg { padding: 40px 0; margin-bottom:40px; } section .gray_box, section .gray_box_r, section .gray_bdr, section .gray_bdr_deco div { padding: 20px; } .contents { margin-top: 50px; } } .sec_inner { max-width: 1200px; padding: 0 4vw; margin: 0 auto; } .bread { position: absolute; padding: 20px 50px; font-size: 0.6875rem; z-index: 20; white-space: nowrap } .bread .item a { color: #171717; } .bread .item:after { content: ">"; padding: 0 1em } .bread .item:last-child:after { content: ""; } @media screen and (max-width:768px) { .bread { display: none; } } img { vertical-align: bottom; } figure { text-align: center; } figcaption { font-size: 12px; color: #777; line-height: 1.2; margin-top: 10px; } /*.art_list figure { aspect-ratio: 3/2; margin-bottom: 10px; }*/ .art_list figure { width: 100%; height: 227px; margin-bottom: 10px; filter: drop-shadow(2px 2px 3px rgb(180, 180, 180, 0.6)); } .art_list figure img { border-radius: 20px; transform:scale(1.0); transition:0.3s all; } .art_list h4 { margin-bottom: 1rem!important; font-weight: 700; line-height: 1.4; } a.art_list:hover figure img { transform:scale(1.05); transition:0.3s all; } a.art_list span { line-height: 1rem; padding: 0 5px !important; display: inline-block !important; color: #fff; font-size: 0.625rem; margin: 0 5px 12px 0; } a.art_list span:first-of-type { background-color: #f9452e; border: 0.5px #fff solid; } a.art_list span:last-of-type { background: #999; } .sec_ttl { width: 100%; text-align: center; letter-spacing: 0.2rem; } .sec_ttl h1.btit { font-weight: 600; font-size: 32px; line-height: 1em; text-align: center; border-bottom: none; padding-top: 80px; } h1.btit span[class^="ja"] { font-weight: 600; font-size: 16px; display: block; } h1.btit .ja_r { color: #f9452d } h1.btit .ja_o { color: #ff8500 } h1.btit .ja_b { color: #1bbcfe } h1.btit .ja_v { color: #7c61ff } h1.btit .ja_g { color: #47a46c } .flex { display: flex; justify-content: space-between; flex-wrap: wrap; } .flex_nb { display: flex; justify-content: space-between; flex-wrap: nowrap; } .flex_flow { display: flex; justify-content: start; flex-wrap: wrap; } .flex_flow figure { display: inline-block; margin-right: 20px; margin-bottom: 30px; } .flex_flow figure:last-child { margin-right: 0; } .box2 { width: 48%; margin-bottom: 30px; } .box2nb { width: 48%; } .box3 { width: 31%; margin-bottom: 30px; } .box3nb { width: 31%; } .box4 { width: 23%; margin-bottom: 30px; } .box37_7 { width: 65%; margin-bottom: 30px; } .flex1 > * { flex: 1; } .gap0 { gap: 0px; } .gap5 { gap: 5px; } .gap15 { gap: 15px; } .gap30 { gap: 30px; } /* --------------------------------- onoka_08 --------------------------------------- */ .com_flex { padding-bottom: 20px; } /* --------------------------------- onoka_08 --------------------------------------- */ @media screen and (max-width: 768px) { .flex { flex-direction: column; } .box2, .box2nb, .box3, .box3nb, .box37_7 { width: 100%; } .flex_flow figure { margin-bottom: 20px; } } /* --------------------------------- title --------------------------------------- */ h1, h2, h3, h4, h5 { font-weight: 600; } [class^="lv1"] { font-size: 2rem; line-height: 1.6; margin-bottom: 36px; } [class^="lv2"] { font-size: 1.5rem; line-height: 1.5 ;margin: 16px 0 24px 0; } [class^="lv3"] { font-size: 1.25rem; line-height: 1.4; margin-bottom: 16px; } [class^="lv4"] { font-size: 1.125rem; line-height: 1.2; margin-bottom: 8px; } [class^="lv5"] { font-size: 1rem; line-height: 1.2; margin-bottom: 8px; } [class$="_vline"] { padding-left: 0.5em; border-left: 0.15em solid #aaa; text-align: left; } [class$="_uline"] { padding-bottom: 0.75em; border-bottom: 2px solid #aaa; text-align: left; margin-bottom: 1.5em } [class$="_mb0"] { margin-bottom: 0!important; } /* CSR変更20250515 */ .ch_h3_ttl { display: flex; align-items: center; height: 70px; font-size: 1.2;} @media screen and (max-width: 768px) { [class^="lv1"] { font-size: 1.5rem; margin-bottom: 24px; } [class^="lv2"] { font-size: 1.25rem; margin: 14px 0 18px 0; } [class^="lv3"] { font-size: 1.125rem; margin-bottom: 12px; } [class^="lv4"] { font-size: 1rem; } } /* ------------------------------- small pic ------------------------------------- */ .img_r30 { float: right; max-width: 30%; margin: 0 0 20px 20px; } .img_l30 { float: left; max-width: 30%; margin: 0 20px 20px 0; } @media screen and (max-width: 768px) { .img_r30, .img_l30 { float: none; max-width: 100%; display: block; margin: 1.5rem auto; }} .clearfix:after { content: ""; display: block; clear: both; } /* ---------------------------- link/button ---------------------------------- */ .icon_o, .icon_r { margin: 16px 0; } .icon_o a { background: url(/ja/images/index2/icon_ora_off.svg) top left / 15px no-repeat; padding-left: 20px; color: #444; line-height: 1rem; font-size: 0.75rem; margin-bottom: 16px; } .icon_o a:hover, .icon_o a.current { background: url(/ja/images/index2/icon_ora.svg) top left / 15px no-repeat; color: #ff8500; font-weight: 600; } .icon_r a { background: url(/ja/images/index2/icon_red_off.svg) top left / 15px no-repeat; padding-left: 20px; color: #444; line-height: 1rem; font-size: 0.75rem; margin-bottom: 16px; } .icon_r a:hover, .icon_r a.current { background: url(/ja/images/index2/icon_red.svg) top left / 15px no-repeat; color: #f9452d; font-weight: 600; } .icon_o a.current:hover, .icon_r a.current:hover { opacity: 0.7 } a.imp_link { display: inline-block; font-weight: 600; font-style: oblique; font-size: 1.125rem; color: #7c61ff; background: url(/ja/images/index2/esti.svg) center left / 30px no-repeat; padding: 10px 0 10px 40px; border-bottom: 2px #7c61ff solid; line-height: 1.5; } a.imp_link:hover { opacity: 0.7; } [class^="btn_idx"] { display: block; width: 100%; height: 115px; text-align: center; font-weight: 600; border-radius: 20px; display: flex; justify-content: center; align-items: center; box-shadow: 3px 3px 3px #f7f7f7; transition: all 0.3s ease;} .btn_idx { background: url(/ja/images/index2/arw06.png) left 7% center / 3% #f0f0f0 no-repeat; } .btn_idxo { background: url(/ja/images/index2/arw01.png) left 7% center / 3% #f0f0f0 no-repeat; } .btn_idxr { background: url(/ja/images/index2/arw02.png) left 7% center / 3% #f0f0f0 no-repeat; } .btn_idxs { background: url(/ja/images/index2/arw03.png) left 7% center / 3% #f0f0f0 no-repeat; } .btn_idxv { background: url(/ja/images/index2/arw04.png) left 7% center / 3% #f0f0f0 no-repeat; } .btn_idxg { background: url(/ja/images/index2/arw07.png) left 7% center / 3% #f0f0f0 no-repeat; } [class^="btn_idx"]:hover { opacity: 0.7; transform: scale(1.02,1.02); } .pdf { display: inline-block; background: url(/ja/images/index2/pdf2.svg) left center / 20px 20px no-repeat; padding-left: 28px; line-height: 1.5rem; color: #369; } a.n_link { color: #369; display: inline-block; } a.n_link2 { color: #369; display: inline; } .outlink { font-size: inherit; font-weight: inherit; } .outlink:after { content: ""; padding-right: 24px; background: url( /ja/images/outlink.svg ) right center / 14px 14px no-repeat; } [class^="arw_"] { background: left 5px center / 10px no-repeat; font-weight: 700; padding-left: 25px; text-align: left; display: inline-block; } .arw_o { background-image: url( /ja/images/index2/arw01.png ); } .arw_r { background-image: url( /ja/images/index2/arw02.png ); } .arw_s { background-image: url( /ja/images/index2/arw03.png ); } .arw_v { background-image: url( /ja/images/index2/arw04.png ); } .arw_g { background-image: url( /ja/images/index2/arw07.png ); } li.non_mkr [class^="arw_"] { margin-left: -36px; } a.notlink {cursor:default;} a.notlink:hover {color:#c6c6c6 !important;} /* ---------------------------------- list ---------------------------------------- */ section.g3 ul, section ol { margin-left: 24px; line-height: 1.5; margin-bottom: 24px; text-align: left; } section.g3 ul li { margin-bottom: 16px; list-style: square; } section.g3 ul li:last-child, section.g3 ol li:last-child { margin-bottom: 0; } section.g3 ul li.non_mkr { list-style: none; } section.g3 ol li { margin-bottom: 16px; } section.g3 ul li ul, section ol li ol, section ol li ul, section ul li ol { margin: 16px 0 16px 24px; } section.g3 ul li ul li, section ol li ul li { list-style: circle; } section.g3 ul li ul li > ul { margin-left: 16px; } section.g3 ul li ul li > ul li { list-style: none; } section.g3 ul li ul li > ul li:before { content: '・'; margin-left:-16px; } section.g3 ul li ol li { list-style: decimal; } section.g3 ul li p, section ol li p { padding-left: 24px; margin-top: 8px; } section.g3 ul li figure, section ol li figure { margin: 16px 0; text-align: left; } /* ------------------------------ notes ------------------------------------ */ section.g3 .notes { font-size: 11px!important; line-height: 1.2!important; color: #777; margin-top: 15px; letter-spacing: 0.05em; } section.g3 .notes ul { margin-left: 0;line-height: 1.2!important; } section.g3 .notes li { list-style: none; padding-left:1.5em; text-indent:-1.5em; margin-bottom: 0; } /* ------------------------------ combinator ------------------------------------ */ p + div.flex { margin-top: 40px; } div.flex + p { margin-top: 10px; } p + img, img + p, p + figure, figure + p, [class^="lv"] + figure, figure + [class^="lv"] { margin-top: 36px!important;} * + [class^="lv2"] { margin-top: 72px; } * + [class^="lv3"] { margin-top: 60px; } * + [class^="lv4"] { margin-top: 48px; } * + [class^="lv5"] { margin-top: 40px; } [class^="lv2"] + * { margin-top: 30px; } [class^="lv3"] + * { margin-top: 24px; } [class^="lv4"] + * { margin-top: 16px; } [class^="lv2"] + [class^="lv3"], [class^="lv2"] + [class^="lv4"], [class^="lv3"] + [class^="lv4"], [class^="lv4"] + [class^="lv4"], [class^="lv4"] + [class^="lv5"] { margin-top: 48px!important; } .ind30 > [class^="lv"] { margin-top: 24px; } /* --------------------------------- table --------------------------------------- */ .normal, .cross { border-collapse: collapse; font-size: 13px; margin: 16px 0 24px 0; width: 100%; } .normal.less, .cross.less { width: auto; } .normal th, .normal td, .cross th, .cross td { border: 0.5px #ccc solid; padding: 10px; line-height: 1.3 } .normal.num td, .cross.num td { text-align:right; } .normal th, .cross th { font-weight: 700; background-color: #e0e0e0; } .normal thead th, .cross thead th { text-align: center; } .normal.th20 th, .cross.th20 th { width: 20%; } .normal.th35 th, .cross.th35 th { width: 35%; } .normal.th50 th, .cross.th50 th { width: 50%; } .normal.th70 th, .cross.th70 th { width: 70%; } .normal caption { font-weight: 700; } .normal td ul, .cross td ul { line-height: 1.5; margin: 5px 0 5px 20px; } .normal td ul li, .cross td ul li { margin-bottom: 4px; } .normal caption, .cross caption { font-weight: 700; font-size: 16px; padding-bottom: 10px; text-align: left; } .normal caption span, .cross caption span{ font-weight: 700; font-size: 12px; color: #777; float: right; padding-top: 15px; line-height: 1; } .normal tfoot th, .cross tfoot th { font-weight: 700; background-color: #eee; } .normal tfoot td, .cross tfoot td { font-weight: 700; background-color: #f7f7f7; } td > p:last-child { margin-bottom: 0!important; } .va_t { vertical-align: top; } .va_b { vertical-align: bottom; } .lucid { border-collapse: collapse; border-spacing: 0; border: 0; } .lucid td, .lucid th { border: 0; padding: 0; line-height: 1.5 } @media screen and (max-width: 768px) { .normal th, .normal td { display: block; } .normal th, .normal.th20 th, .normal.th35 th, .normal.th50 th, .normal.th70 th { width: 100%; border-bottom: 0; border-top: 0; } .normal tr:first-child th { border-top:0.5px #ccc solid;} .w15_a, .w20_a, .w25_a, .w30_a, .w40_a, .w50_a { width: auto; } .lucid td:last-child { padding-left: 1rem } } @media screen and (max-width: 1200px) { .tbl_scroll { overflow-x: scroll; margin-bottom: 24px; } .tbl_scroll table { overflow-x: scroll; min-width: 900px; margin-top: 0; } } /********************* Cookie **********************/ .cookie_panel { display: flex; justify-content: space-between; align-items: center; position: fixed; bottom: -280px; left: calc(50% - 80vw/2); width: 80%; font-size: 14px; background: #fff; padding: 1.2em; border: 1px solid #ddd; visibility: visible; box-sizing: border-box; transition: .5s; text-align: left; line-height: 1.7; z-index: 1000; box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.3);font-family: 'noto-sans-cjk-jp';} .cookie_panel.open { bottom: 20px; } .cookie_tx { width: 90%; } .cookie_btn { color: #fff; background: #7c61ff; padding: .5em 1.5em; } .cookie_btn:hover { cursor: pointer; background: #b9acff } .fadeout { animation: hide .3s linear 0s; animation-fill-mode: forwards; } @keyframes hide { from { opacity: 1; } to { opacity: 0; visibility: hidden; } } @media screen and (max-width: 768px) { .cookie_panel { flex-direction: column; width: 90%; left: calc(50% - 90vw/2); } .cookie_panel.open { bottom: 15px; } .cookie_tx { width: 100%; margin-bottom: 1em; } } /* -------------------------- module -------------------------------- */ .for_pc { display:block!important; } .for_sp { display:none!important; } @media screen and (max-width:768px) { .for_sp { display:block!important; } .for_pc { display:none!important; } } .left { text-align: left!important; } .right { text-align: right!important; } .f_right { float: right; } .center { text-align: center!important; } .b_center { margin-right: auto; margin-left: auto; } .v_mid { display: flex; align-items: center; } .nowrap { white-space: nowrap!important; } hr { border-top: 1px solid #ccc; margin: 2rem 0; } sup { vertical-align: super; font-size: 10px; } .bg_wht { background-color: #fff; padding: 20px; } b, .b { font-weight: 700; } .red { color: #f9452d; } .ora { color: #ff8500; } .blu { color: #1bbcfe; } .vio { color: #7c61ff; } .gray { color: #999; } .fs12 { font-size: 12px; line-height: 20px; } .fs14 { font-size: 14px; line-height: 24px; } .fs18 { font-size: 18px; line-height: 32px; } .fs20 { font-size: 20px; line-height: 40px; } .fs24 { font-size: 24px; line-height: 48px; } .fs30 { font-size: 30px; line-height: 60px; } .lh1 { line-height: 1; } .lh15 { line-height: 1.5; } .ind30 { padding-left: 30px; } @media screen and (max-width:768px) { .ind30 { padding-left: 15px; } } .ind2nd { padding-left: 2em; text-indent: -1.5em; } .ml15 { margin-left: 15px; } @media screen and (max-width:768px) { .ml15 { margin-left: 0; } } .mv10 { margin-top: 10px; margin-bottom: 10px; } .mv20 { margin-top: 20px; margin-bottom: 20px; } .mv45 { margin-top: 45px; margin-bottom: 45px; } .mb0 { margin-bottom:0!important; } .mb5 { margin-bottom:5px!important; } .mb15 { margin-bottom:15px!important; } .mb30 { margin-bottom:30px!important; } .mb45 { margin-bottom:45px!important; }.mb60 { margin-bottom:60px!important; } .mb90 { margin-bottom:90px!important; } .mb120 { margin-bottom:120px!important; } .mt0 { margin-top:0!important; } .mt15 { margin-top:15px!important; } .mt30 { margin-top:30px!important; } .mt45 { margin-top:45px!important; } .mt60 { margin-top:60px!important; } .mt90 { margin-top:90px!important; } .mt120 { margin-top:120px!important; } .img_full { width: 100%; } .img_max { max-width: 100%; } .img_fit { width: 100%; height: 100%; object-fit: cover; } .img_rad { border-radius: 20px; } .w15_a { width: 15%; } .w20_a { width: 20%; } .w25_a { width: 25%; } .w30_a { width: 30%; } .w40_a { width: 40%; } .w50_a { width: 50%; } .w37_a { width: 37%; } .w35_a { width: 35%; } @media screen and (max-width: 768px) { .w15_a, .w20_a, .w25_a, .w30_a, .w40_a, .w50_a { width: auto; } } .w10 { width: 10%; } .w15 { width: 15%; } .w20 { width: 20%; } .w30 { width: 30%; } .w50 { width: 50%; } .w60 { width: 60%; } .w30_50 { width: 30%; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .w30_50 { width: 50%; } } .w30_100 { width: 30%; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .w30_100 { width: 100%; } } .w50_100 { width: 50%; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .w50_100 { width: 100%; } } .w65_100 { width: 65%; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .w65_100 { width: 100%; } } .w80_100 { width: 80%; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .w80_100 { width: 100%; } } .w90_100 { width: 90%; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .w90_100 { width: 100%; } } /* CSR変更20250515 */ .w85 { width: 85%; } /* ヘッダー変更202408 */ #btn-contact { position: absolute; right: 210px; top: 14px; background: #f7f7f7; line-height: 1em; font-size: 15px; border-radius: 22px; font-family: FontAwesome; } #btn-contact a { display: block; padding: 16px; font-weight: 500; color: #ff8500!important; } /*20250414追加*/ .italic_txt { font-style: italic!important; } /*20250826追加*/ #inquiry section .gray_box_r { height: 100%; }