@charset "UTF-8";
/******************************* Preface ***************************************/
a:hover { color: #00489E; }

/********************************* body ***************************************/
body { /******************************** header **************************************/ /********************************  Main Content ******************************/ /***********************************  footer ********************************/ }

body header .inner { padding: 1rem 1rem; }

body header .inner .f-warp { padding-right: 0; }

body header .inner .f-warp .logo_area .jr_logo { width: 22%; max-width: 90px; margin-right: 0.9rem; padding-right: .9rem; margin-top: .2%; }

body header .inner .f-warp .logo_area .tach_logo { font-size: .8rem; line-height: 1.3; }

body header .inner .f-warp .swich { margin-left: 0rem; margin-right: 4rem; }

body header .inner .f-warp .swich a { width: 100%; display: block; font-size: .8rem; padding: .1rem .8rem .2rem .8rem; }

body header .inner .funa2_nav { display: none; }

body header .inner .menu-wrapper { display: block; }

body header .inner .menu-wrapper .gnav { position: fixed; top: 0; right: -100%; bottom: 0; width: 100%; padding-top: 4rem; background: #fff; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; transition: all .5s; opacity: 0; z-index: -1; }

body header .inner .menu-wrapper .gnav .gnav_inr { width: 100%; height: 100%; background: #00489E; }

body header .inner .menu-wrapper .gnav .gnav_inr .menu-container { padding: 0 1.5rem; }

body header .inner .menu-wrapper .gnav .gnav_inr .menu-container .menu li { width: 100%; border-bottom: solid 1px #fff; position: relative; }

body header .inner .menu-wrapper .gnav .gnav_inr .menu-container .menu li:last-of-type { border-bottom: 0; }

body header .inner .menu-wrapper .gnav .gnav_inr .menu-container .menu li a { display: block; color: #fff; padding: 1.5rem 3rem 1.5rem 1rem; transition: .3s; }

body header .inner .menu-wrapper .gnav .gnav_inr .menu-container .menu li::after { content: ''; display: inline-block; width: 16px; height: 16px; background: url("../img/nav_arrow.png") no-repeat center center; background-size: contain; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); }

body header .inner .menu-wrapper .toggle-btn { position: absolute; top: 50%; right: 1rem; width: 45px; height: 45px; transition: all .5s; cursor: pointer; z-index: 999; transform: translateY(-50%); background: #00489E; border-radius: 999px; }

body header .inner .menu-wrapper .toggle-btn span { display: block; position: absolute; left: 0; width: 20px; height: 2px; background-color: #fff; transition: all .5s; }

body header .inner .menu-wrapper .toggle-btn span:nth-child(1) { top: 15px; left: 0; right: 0; margin: 0 auto; }

body header .inner .menu-wrapper .toggle-btn span:nth-child(2) { top: 22px; left: 0; right: 0; margin: 0 auto; }

body header .inner .menu-wrapper .toggle-btn span:nth-child(3) { bottom: 14px; left: 0; right: 0; margin: 0 auto; }

body header .inner .menu-wrapper.menu-open .gnav { top: 0; right: 0; opacity: 1; }

body header .inner .menu-wrapper.menu-open .toggle-btn { margin-top: 0; }

body header .inner .menu-wrapper.menu-open .toggle-btn:hover span { background-color: #fff; }

body header .inner .menu-wrapper.menu-open .toggle-btn span { background-color: #fff; }

body header .inner .menu-wrapper.menu-open .toggle-btn span:nth-child(1) { -webkit-transform: translateY(6px) rotate(-315deg); transform: translateY(6px) rotate(-315deg); }

body header .inner .menu-wrapper.menu-open .toggle-btn span:nth-child(2) { opacity: 0; }

body header .inner .menu-wrapper.menu-open .toggle-btn span:nth-child(3) { -webkit-transform: translateY(-8px) rotate(315deg); transform: translateY(-8px) rotate(315deg); }

body .main_vi { background: url("../img/mv_sp.png"); background-size: cover; width: 100%; }

body .main_vi .main_vi_inner { display: block; padding: 2rem 2rem; }

body .main_vi .sub { width: 73%; margin: 1rem auto 0 auto; }

body .content-wrap { padding: 3rem 1.5rem; }

body .content-wrap .inner.inner-l { width: 100%; max-width: 100%; margin: 0 auto; }

body .content-wrap .inner.inner-m { width: 100%; max-width: 100%; margin: 0 auto; }

body .content-wrap .inner.inner-s { width: 100%; max-width: 100%; margin: 0 auto; }

body .content-wrap h1.content-title, body .content-wrap h2.content-title, body .content-wrap h3.content-title, body .content-wrap h4.content-title, body .content-wrap h5.content-title, body .content-wrap h6.content-title { margin-bottom: 2rem; }

body .content-wrap h1.content-title.content-title-01 span, body .content-wrap h2.content-title.content-title-01 span, body .content-wrap h3.content-title.content-title-01 span, body .content-wrap h4.content-title.content-title-01 span, body .content-wrap h5.content-title.content-title-01 span, body .content-wrap h6.content-title.content-title-01 span { display: block; }

body .content-wrap h1.content-title.content-title-01 span.jp, body .content-wrap h2.content-title.content-title-01 span.jp, body .content-wrap h3.content-title.content-title-01 span.jp, body .content-wrap h4.content-title.content-title-01 span.jp, body .content-wrap h5.content-title.content-title-01 span.jp, body .content-wrap h6.content-title.content-title-01 span.jp { font-size: 1.6rem; }

body .content-wrap h1.content-title.content-title-01 span.en, body .content-wrap h2.content-title.content-title-01 span.en, body .content-wrap h3.content-title.content-title-01 span.en, body .content-wrap h4.content-title.content-title-01 span.en, body .content-wrap h5.content-title.content-title-01 span.en, body .content-wrap h6.content-title.content-title-01 span.en { font-size: 1rem; }

body .content-wrap.content-wrap-news .inner { display: block; padding: 1rem 1.5rem 1rem 1.5rem; }

body .content-wrap.content-wrap-news .inner .news-title { width: 100%; font-size: 1.4rem; margin-bottom: 1rem; }

body .content-wrap.content-wrap-news .inner .news-list { width: 100%; }

body .content-wrap.content-wrap-news .inner .news-list .news-item a { display: block; align-items: center; position: relative; padding: 1rem 3.5rem 1rem 1rem; }

body .content-wrap.content-wrap-news .inner .news-list .news-item a .date { margin-right: 0; margin-bottom: .5rem; }

body .content-wrap.content-wrap-news .inner .news-list .news-item a i { font-size: 1.2rem; }

body .content-wrap.content-wrap-intro { padding-top: 1rem; }

body .content-wrap.content-wrap-intro .intro-top { display: flex; flex-wrap: wrap; flex-direction: column-reverse; margin-bottom: 3.5rem; }

body .content-wrap.content-wrap-intro .intro-top .mark { width: 62%; margin: 0 auto; }

body .content-wrap.content-wrap-intro .intro-top .copy { width: 100%; margin-left: 0; margin-bottom: 2rem; }

body .content-wrap.content-wrap-intro .intro-top .copy h4 { font-size: 1.6rem; margin-bottom: 1rem; line-height: 1.6; }

body .content-wrap.content-wrap-intro .intro-bottom { display: flex; flex-wrap: wrap; margin-top: 3rem; }

body .content-wrap.content-wrap-intro .intro-bottom .thm { width: 100%; margin: 0 auto; }

body .content-wrap.content-wrap-intro .intro-bottom .copy { width: 100%; margin-right: 0; margin-bottom: 2rem; }

body .content-wrap.content-wrap-intro .intro-bottom .copy h4 { font-size: 1.6rem; margin-bottom: 1rem; line-height: 1.6; }

body .content-wrap.content-wrap-howto .howto01 { padding: 3rem 0; }

body .content-wrap.content-wrap-howto .caution { font-weight: bold; font-size: 1.1rem; margin-bottom: 1.5rem; }

body .content-wrap.content-wrap-history { padding: 3rem 0; }

body .content-wrap.content-wrap-history .inner-history-narrow { padding: 0 1.5rem; }

body .content-wrap.content-wrap-history .inner-history-wide { padding-left: 1.5rem; }

body .content-wrap.content-wrap-history .history_head { display: block; margin-bottom: 2rem; padding: 1.5rem; }

body .content-wrap.content-wrap-history .history_head .history_txt { width: 100%; margin-right: 0; }

body .content-wrap.content-wrap-history .history_head .history_txt .caution { font-size: .85rem; margin-top: 1.3rem; margin-bottom: 1.3rem; }

body .content-wrap.content-wrap-history .history_head .qr { width: 100%; }

body .content-wrap.content-wrap-history .history_head .qr img { width: 38% !important; }

body .content-wrap.content-wrap-history .history_head .qr .txt { font-weight: bold; font-size: .9rem; margin-top: 1rem; }

body .content-wrap.content-wrap-history .history_bottom { overflow: scroll; }

body .content-wrap.content-wrap-history .history_bottom .history_list { width: 860px; margin-right: 1.5rem; display: flex; align-items: stretch; }

body .content-wrap.content-wrap-history .history_bottom .history_list .history-item { width: 30%; }

body .content-wrap.content-wrap-history .history_bottom .history_list .history-item .num { font-size: 1.8rem; margin-top: .8rem; margin-bottom: .1rem; }

body .content-wrap.content-wrap-history .history_bottom .history_list .history-item .txt { font-size: .85rem; margin-bottom: 1.5rem; }

body .content-wrap.content-wrap-history .history_bottom .history_list .history-ar { transform: translateY(-13%); }

body .content-wrap.content-wrap-usecase .usecase_area .usecase_area_ttl { font-size: 1.2rem; padding: 1rem 0; }

body .content-wrap.content-wrap-usecase .usecase_area .usecase_area_ttl span { font-size: 1rem; margin-left: 2rem; }

body .content-wrap.content-wrap-usecase .usecase_area .usecase_area_map { background: #fff; padding: 1.5rem 1rem; }

body .content-wrap.content-wrap-usecase .use-slider { position: relative; }

body .content-wrap.content-wrap-usecase .use-slider .slick-item { margin: 0 1rem; }

body .content-wrap.content-wrap-usecase .use-slider .slick-arrow { width: 2.5%; position: absolute; top: 50%; transform: translateY(-50%); z-index: 100; }

body .content-wrap.content-wrap-usecase .use-slider .slick-arrow.prev { left: 1.5%; }

body .content-wrap.content-wrap-usecase .use-slider .slick-arrow.next { right: 1.5%; }

body .content-wrap.content-wrap-usecase .area-caution { display: block; padding: 1.5rem; max-width: 100%; margin: 2.5rem auto; }

body .content-wrap.content-wrap-usecase .area-caution .ttl { text-align: center; width: 100%; font-size: 1.2rem; border-bottom: solid 1px #B0B0B0; padding-bottom: .5rem; margin-bottom: 1rem; }

body .content-wrap.content-wrap-usecase .area-caution .area-caution-list { width: 100%; border-left: 0; padding-left: 0; }

body .content-wrap.content-wrap-usecase .area-caution .area-caution-list li { font-size: .9rem; }

body .content-wrap.content-wrap-usecase .new-area-ttl { font-size: 1rem; padding: 1rem 0; }

body .content-wrap.content-wrap-usecase .new-area-ttl::after { content: ""; position: absolute; right: 1.5rem; top: 50%; width: 10px; height: 10px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: translateY(-50%) rotate(45deg); }

body .content-wrap.content-wrap-usecase .new-area { border: solid 3px #00489E; max-width: 100%; margin: 0 auto; }

body .content-wrap.content-wrap-usecase .new-area .new-map { margin: 1.5rem 0 1.5rem 0; }

body .content-wrap.content-wrap-usecase .new-area .new-area-inr { padding: 1.2rem 1rem 2rem 1rem; }

body .content-wrap.content-wrap-usecase .new-area .ttl { font-size: 1.3rem; font-weight: bold; line-height: 1.6; }

body .content-wrap.content-wrap-usecase .new-area .txt { font-size: .9rem; }

body .content-wrap.content-wrap-faq .faqcaution { font-size: .85rem; margin-top: 2rem; padding-left: 1rem; text-indent: -1rem; }

body .content-wrap .accordion_list .accordion-item { padding: 1rem 1.5rem; margin-bottom: 1.5rem; }

body .content-wrap .accordion_list .accordion-item:last-of-type { margin-bottom: 0; }

body .content-wrap .accordion_list .accordion-item .accordion-header .accordion-title img { width: 11%; margin-right: .8rem; vertical-align: bottom; margin-top: .2rem; }

body .content-wrap .accordion_list .accordion-item .accordion-header .accordion-title .ttl { width: 100%; font-size: 1.1rem; padding-right: 1rem; line-height: 1.6; }

body .content-wrap .accordion_list .accordion-item .accordion-header .accordion-icon { font-size: 1.2rem; }

body .content-wrap .accordion_list .accordion-item .accordion-content .content { padding-top: 1.5rem; font-size: .9rem; }

body footer.footer { background: #00489E; padding: 1.5rem 0 1.2rem 0; }

body footer.footer .copyright { font-size: .85rem; color: #fff; font-weight: lighter; }

#page-top a { width: 40px; height: 40px; }

#page-top a #page-top a:hover { background: #00489E; color: #000; }

/*リンクを右下に固定*/
#page-top { position: fixed; right: 20px; bottom: 40px; z-index: 2; opacity: 0; transform: translateY(100px); }
