body { margin: 0; padding: 0; }

div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }

ol, ul { list-style: none; }

fieldset, img { border: 0; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th { text-align: left; }

address, caption, cite, code, dfn, em, th, var { font-style: normal; font-weight: normal; }

img { vertical-align: bottom; }

html { margin: 0; padding: 0; width: 100%; }
@media screen and (min-width: 768px) and (max-width: 1247px) { html { font-size: 20px; font-size: 1.6vw; } }
@media screen and (min-width: 1248px) { html { font-size: 20px; } }
@media screen and (max-width: 767px) { html { font-size: 2.666667vw; } }

body { width: 100%; background: #fff; color: #000; font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif; font-size: 0.8rem; text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; transition: all 0.3s ease-out; }
@media screen and (min-width: 768px) and (max-width: 1247px) { body { font-size: 0.6rem; } }
@media screen and (min-width: 1248px) { body { font-size: 0.6rem; } }
@media screen and (max-width: 767px) { body { font-size: 1.2rem; } }

strong, b { font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif; }

a { color: #000; text-decoration: none; }

a:hover { color: #000; text-decoration: none; }

.pc { display: block !important; }
@media screen and (max-width: 767px) { .pc { display: none !important; } }

.sp { display: none !important; }
@media screen and (max-width: 767px) { .sp { display: block !important; } }

.pc_ib { display: inline-block !important; }
@media screen and (max-width: 767px) { .pc_ib { display: none !important; } }

.sp_ib { display: none !important; }
@media screen and (max-width: 767px) { .sp_ib { display: inline-block !important; } }

svg { width: 100%; height: auto; vertical-align: top; }

img { width: 100%; height: auto; }

.plx { transition: transform 1.6s ease-out; }
@media screen and (max-width: 767px) { .plx { transition: none; } }

#wrapper { position: relative; width: 100%; }

#container { position: relative; width: 100%; overflow: hidden; }

header { position: fixed; z-index: 2; width: 100%; height: 3.3rem; background: #0064d2; color: #fff; }
@media screen and (max-width: 767px) { header { height: 4.95rem; } }
@media screen and (max-width: 767px) { header .header_wrapper { position: relative; z-index: 3; height: 4.95rem; background: #0064d2; } }
header h1.title { position: absolute; top: 0; left: 0; width: 12rem; height: 3.3rem; }
@media screen and (max-width: 767px) { header h1.title { left: 50%; margin: 0 0 0 -7.1rem; width: 14.2rem; height: 4.95rem; } }
header h1.title a { display: block; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
header h1.title img { width: 7.75rem; }
@media screen and (max-width: 767px) { header h1.title img { width: 14.2rem; } }
header #menu { position: absolute; top: 0; right: 0; width: 4.95rem; height: 4.95rem; background: #004189; }
@media print, screen and (min-width: 767px) { header #menu { display: none; } }
header #menu span { position: absolute; left: 1rem; width: 2.85rem; height: 0.2rem; background: #fff; transition: all 0.3s ease-out; }
header #menu span.top { top: 1.55rem; transform-origin: left center; }
header #menu span.middle { top: 2.35rem; }
header #menu span.bottom { top: 3.2rem; transform-origin: left center; }
header #menu.is_open span.top { width: 3.2rem; top: 1.3rem; left: 1.45rem; transform: rotate(45deg); }
header #menu.is_open span.middle { opacity: 0; }
header #menu.is_open span.bottom { width: 3.2rem; top: 3.55rem; left: 1.45rem; transform: rotate(-45deg); }
header #menu_area { position: absolute; top: 0; right: 0; height: 100%; }
@media screen and (max-width: 767px) { header #menu_area { display: none; } }
header #menu_area .navi { position: relative; height: 100%; }
header #menu_area ul.list { display: flex; align-items: center; height: 100%; margin: 0 0.65rem 0 0; }
header #menu_area ul.list li { height: 100%; padding: 0 0.65rem; margin: 0 0.35rem; }
header #menu_area ul.list li a { display: block; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 15px; font-weight: bold; white-space: nowrap; }
header #menu_area #navi_bar { position: absolute; left: 0; bottom: 0; width: 0; height: 0.15rem; background: #fff; transition: all 0.3s ease-out; }
header #menu_area #navi_bar.home { width: 4.5rem; left: 1.1rem; }
header #menu_area #navi_bar.about { width: 6.75rem; left: 6rem; }
header #menu_area #navi_bar.kouka { width: 7.15rem; left: 10.25rem; }
header #menu_area #navi_bar.casestudy { width: 3.9rem; left: 18.4rem; }
header #menu_area #navi_bar.tech { width: 9.8rem; left: 23.4rem; }
header #menu_area_sp { position: absolute; top: 0; right: 0; z-index: 2; width: 100%; height: 100vh; min-height: 50rem; background: #0068d4; top: -100vh; opacity: 0; transition: all 0.3s ease-out; }
header #menu_area_sp.is_open { top: 0; opacity: 1; }
@media print, screen and (min-width: 767px) { header #menu_area_sp { display: none; } }
header #menu_area_sp .menu_area_wrapper { position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); }
header #menu_area_sp .navi { position: relative; }
header #menu_area_sp .navi ul.list { width: 30.2rem; margin: 0 auto 0; }
header #menu_area_sp .navi ul.list li + li { margin: 3rem auto 0; }
header #menu_area_sp .navi ul.list li a { position: relative; display: block; width: 100%; height: 100%; padding: 0.6rem 0 0.6rem 3.6rem; box-sizing: border-box; color: #fff; font-size: 1.65rem; font-weight: bold; letter-spacing: 0.01em; line-height: 1; }
header #menu_area_sp .navi ul.list li a:after { content: ''; position: absolute; top: 1.4rem; left: 0; width: 1.9rem; height: 0.1rem; background: #fff; }
header #menu_area_sp .contact_menu { position: relative; background: #fff; border: #0064d2 1px solid; border-radius: 0.15rem; box-sizing: border-box; display: block; width: 25.9rem; height: auto; margin: 6.8rem auto 0; padding: 1.5rem 1.3rem 1.25rem; }
header #menu_area_sp .contact_menu h3.title { color: #0064d2; font-size: 1.35rem; font-weight: bold; line-height: 1; letter-spacing: 0.01em; text-align: center; }
header #menu_area_sp .contact_menu ul.list { margin: 1.45rem auto 0; width: 100%; display: block; }
header #menu_area_sp .contact_menu ul.list li { position: relative; width: 23rem; height: 3rem; }
header #menu_area_sp .contact_menu ul.list li a { position: relative; background-color: #0064d2; display: block; width: 100%; height: 100%; color: #fff; font-size: 1.5rem; font-weight: bold; text-align: center; letter-spacing: 0.03em; font-feature-settings: "palt"; display: flex; justify-content: center; align-items: center; }
header #menu_area_sp .contact_menu ul.list li a span.ico { position: absolute; top: 1.1rem; right: 1rem; width: 0.55rem; height: 1rem; }
header #menu_area_sp .contact_menu ul.list li + li { margin: 0.5rem 0 0; }

.header_contact_menu { position: fixed; top: 3.8rem; right: 0.5rem; z-index: 1; background: #fff; border: #0064d2 1px solid; border-radius: 0.15rem; width: 12.3rem; box-sizing: border-box; padding: 0.75rem 0.7rem 0.65rem 0.6rem; }
@media screen and (max-width: 767px) { .header_contact_menu { position: fixed; top: auto; bottom: 0; right: 0; z-index: 1; width: 100%; height: 7.45rem; padding: 0.85rem 0 1rem; border-radius: 0; border: 0; border-top: #0064d2 1px solid; box-sizing: border-box; } }
.header_contact_menu h3.title { color: #0064d2; font-size: 13px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; text-align: center; }
@media screen and (max-width: 767px) { .header_contact_menu h3.title { font-size: 1.5rem; } }
.header_contact_menu ul.list { margin: 0.65rem auto 0; width: 100%; }
@media screen and (max-width: 767px) { .header_contact_menu ul.list { margin: 0.75rem auto 0; display: flex; justify-content: center; } }
.header_contact_menu ul.list li { position: relative; width: 11.05rem; height: 1.45rem; }
@media screen and (max-width: 767px) { .header_contact_menu ul.list li { width: 19.45rem; height: 3.15rem; } }
.header_contact_menu ul.list li a { position: relative; background-color: #0064d2; border-radius: 0.15rem; display: block; width: 100%; height: 100%; color: #fff; font-size: 0.75rem; font-weight: bold; text-align: center; letter-spacing: 0.03em; font-feature-settings: "palt"; display: flex; justify-content: center; align-items: center; transition: background-color 0.3s ease-out; }
@media screen and (max-width: 767px) { .header_contact_menu ul.list li a { font-size: 1.4rem; } }
.header_contact_menu ul.list li a span.ico { position: absolute; top: 0.55rem; right: 0.3rem; width: 0.3rem; height: 0.45rem; }
@media screen and (max-width: 767px) { .header_contact_menu ul.list li a span.ico { top: 1.15rem; right: 0.3rem; width: 0.55rem; height: 0.8rem; } }
.header_contact_menu ul.list li a.over { background-color: #5e9adc; }
.header_contact_menu ul.list li + li { margin: 0.25rem auto 0; }
@media screen and (max-width: 767px) { .header_contact_menu ul.list li + li { width: 15.15rem; margin: 0 0 0 0.65rem; } }

#visial_area { position: relative; width: 100%; height: 516px; overflow: hidden; color: #fff; background: url("../img/visual.jpg") no-repeat center; background-size: cover; display: flex; justify-content: center; align-items: center; }
@media screen and (max-width: 767px) { #visial_area { margin-top: 4.95rem; height: 225px; background: url("../img/visual_sp.jpg") no-repeat center; background-size: cover; } }
#visial_area #visual_bg { position: absolute; top: 0; left: 0; width: 100%; transition: all 2.0s ease-in-out; }
.ie #visial_area #visual_bg { top: auto; bottom: 0; }
.end #visial_area #visual_bg { transform: translateY(calc(100vw * -1.077 + 100vh)); }
@media screen and (max-width: 767px) { .end #visial_area #visual_bg { transform: translateY(calc(100vw * -2.0053 + 100vh)); } }
.ie .end #visial_area #visual_bg { transform: translateY(0); }
#visial_area h2.title { width: 32.25rem; }
@media screen and (max-width: 767px) { #visial_area h2.title { width: 34.1rem; } }
#visial_area p.lead { position: absolute; top: 8rem; left: 50%; width: 20.05rem; margin: 0 0 0 -10rem; }
@media screen and (max-width: 767px) { #visial_area p.lead { top: 11.9rem; width: 23.4rem; margin: 0 0 0 -11.7rem; } }
#visial_area .scroll_ico { position: absolute; bottom: 0.85rem; left: 50%; margin: 0 0 0 -3.3rem; padding: 0.25rem 0 0; box-sizing: border-box; width: 6.65rem; height: 3.8rem; background: url(../img/visual_ico_scroll.svg) no-repeat; background-size: cover; }
@media screen and (max-width: 767px) { #visial_area .scroll_ico { display: none; } }
#visial_area .scroll_ico span.text { display: block; width: 100%; color: #0064d2; font-size: 0.95rem; font-weight: bold; line-height: 1; letter-spacing: -0.03em; text-align: center; }

.side_text { position: absolute; top: 5.25rem; left: 2.15rem; width: 0.8rem; }
@media screen and (max-width: 767px) { .side_text { display: none; } }

#about_area { position: relative; width: 100%; padding: 5rem 0 5rem; background: #f1f1f1; text-align: center; }
@media screen and (max-width: 767px) { #about_area { margin: 0; padding: 2.4rem 0 5.5rem; } }
#about_area.about_top { padding-top: 6.5rem; }
#about_area .scroll_line { position: absolute; top: 0; left: 50%; width: 1px; height: 3.15rem; background: #000; }
@media screen and (max-width: 767px) { #about_area .scroll_line { display: none; } }
#about_area .scroll_line.bottom { top: auto; bottom: 0; }
#about_area .side_logo { position: absolute; top: 5rem; right: 0; width: 3.25rem; }
@media screen and (max-width: 767px) { #about_area .side_logo { display: none; } }
#about_area h2.title, #about_area h1.title { color: #0064d2; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #0064d2 0.3rem solid; }
@media screen and (max-width: 767px) { #about_area h2.title, #about_area h1.title { font-size: 2rem; padding: 0 0.9rem 1rem; } }
#about_area .text_area { margin: 0; }
@media screen and (max-width: 767px) { #about_area .text_area { margin: 0; } }
#about_area .text_area .logo { width: 17.6rem; margin: 0 auto 0; opacity: 0; transition: opacity 1.6s ease-out; }
@media screen and (max-width: 767px) { #about_area .text_area .logo { width: 24.65rem; } }
#about_area .text_area .logo.visible { opacity: 1; }
.ie #about_area .text_area .logo { opacity: 1; }
#about_area .text_area p.lead { margin: 0; color: #0064d2; font-size: 21px; font-weight: bold; line-height: 1.828; letter-spacing: 0.05em; font-feature-settings: "palt"; transition: opacity 1.6s ease-out 0.8s; opacity: 0; }
@media screen and (max-width: 767px) { #about_area .text_area p.lead { margin: 0; font-size: 1.45rem; } }
#about_area .text_area p.lead.visible { opacity: 1; }
.ie #about_area .text_area p.lead { opacity: 1; }
#about_area .kamikuru_image { background: #fff; width: 60rem; margin: 3.2rem auto 0; padding: 2.6rem 0 1.9rem; }
@media screen and (max-width: 767px) { #about_area .kamikuru_image { width: 100%; margin: 1.7rem auto 0; padding: 2.1rem 0 2.4rem; } }
#about_area .image { position: relative; width: 48.05rem; margin: 0 auto 0; }
@media screen and (max-width: 767px) { #about_area .image { width: 35.5rem; } }
#about_area .image span.ico { position: absolute; top: 14.6rem; left: 15.35rem; width: 17.45rem; }
@media screen and (max-width: 767px) { #about_area .image span.ico { top: 16.75rem; left: 7.65rem; width: 20rem; } }
#about_area p.about { margin: 3.25rem 0 0; color: #0064d2; font-size: 15px; font-weight: bold; line-height: 1.75; letter-spacing: 0.05em; font-feature-settings: "palt"; }
@media screen and (max-width: 767px) { #about_area p.about { margin: 4rem 0 0; font-size: 1.3rem; } }
#about_area .button { margin: 3rem 0 0; }
@media print, screen and (min-width: 767px) { #about_area .button { display: flex; justify-content: center; } }
#about_area .button a { position: relative; display: flex; justify-content: center; align-items: center; width: 25rem; height: 3.5rem; border-radius: .3em; background: #0064d2; font-size: 1.05rem; font-weight: bold; text-align: center; color: #fff; transition: background-color 0.3s ease-out; box-shadow: 0.2rem 0.2rem 0 0 #034893; }
@media screen and (max-width: 767px) { #about_area .button a { margin: 0 auto; width: 27.6rem; height: 4.8rem; font-size: 1.3rem; } }
#about_area .button a i { display: block; position: absolute; width: 0.5rem; height: 0.9rem; right: 0.6rem; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 767px) { #about_area .button a i { width: 0.8rem; height: 1.45rem; right: 1rem; } }
#about_area .button a.over { background-color: #5e9adc; }
@media print, screen and (min-width: 767px) { #about_area .button a + a { margin-left: 1.5em; } }
@media screen and (max-width: 767px) { #about_area .button a + a { margin-top: 1.5em; } }

#kouka_area { position: relative; margin: 0 auto 0; padding: 4.55rem 0 0; width: 60rem; }
@media screen and (max-width: 767px) { #kouka_area { width: 35.5rem; margin: 0 auto 0; padding: 2rem 0 0; } }
#kouka_area h2.title { width: 100%; height: 3.5rem; background: #0064d2; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 25px; font-weight: bold; padding: 0; }
@media screen and (max-width: 767px) { #kouka_area h2.title { height: 4.4rem; font-size: 1.75rem; } }
#kouka_area .inner { background: #fff; padding: 3rem 0 3rem 1.5rem; }
@media screen and (max-width: 767px) { #kouka_area .inner { padding: 0; } }
#kouka_area ul.box_list { display: flex; flex-wrap: wrap; }
#kouka_area ul.box_list li.box { width: 18.7rem; margin: 0 0.45rem 0 0; padding: 1.5rem 1.2rem 1.1rem 1.35rem; box-sizing: border-box; background: #f0f7ff; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box { width: 31.5rem; margin: 0 auto 0; padding: 2.9rem 0 1.35rem; background: transparent; }
  #kouka_area ul.box_list li.box + li.box { border-top: #c9c9c9 0.1rem solid; } }
#kouka_area ul.box_list li.box p.text { margin: 0.6rem auto 0; font-size: 15px; line-height: 1.733; text-align: left; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box p.text { margin: 0.8rem auto 0; font-size: 1.25rem; } }
#kouka_area ul.box_list li.box h3.title { margin: 0.7rem auto 0; font-size: 20px; font-weight: bold; line-height: 1.4; min-height: 2.8rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box h3.title { margin: 0.8rem auto 0; font-size: 1.8rem; min-height: auto; } }
#kouka_area ul.box_list li.box.lbox { width: 28.25rem; margin: 1rem 0.6rem 0 0; padding: 2.1rem 2.1rem 1.1rem 2.25rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box.lbox { width: 31.5rem; margin: 0 auto 0; padding: 2.9rem 0 1.35rem; } }
#kouka_area ul.box_list li.box.lbox h3.title { min-height: 2.2rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box.lbox h3.title { min-height: auto; } }
#kouka_area ul.box_list li.box p.no { color: #0064d2; font-size: 32px; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box p.no { font-size: 2rem; } }
#kouka_area ul.box_list li.box ul.goal_list { margin: 2rem auto 0; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.goal_list { margin: 1.3rem auto 0; } }
#kouka_area ul.box_list li.box ul.goal_list li { margin: 0 auto 0; width: 20.65rem; height: 1.75rem; display: flex; align-items: center; color: #fff; font-size: 0.8rem; font-weight: bold; text-align: left; text-indent: 1rem; background: #28bce2; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.goal_list li { width: 100%; height: 2.65rem; font-size: 1.25rem; text-indent: 1.55rem; } }
#kouka_area ul.box_list li.box ul.goal_list li.goal_4 { background: #c5192d; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_7 { background: #fcc20e; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_8 { background: #a21842; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_9 { background: #fd6825; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_11 { background: #fd9c26; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_12 { background: #bf8a2f; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_13 { background: #3f7e44; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_15 { background: #57c02b; }
#kouka_area ul.box_list li.box ul.goal_list li.goal_17 { background: #19486a; }
#kouka_area ul.box_list li.box ul.goal_list li + li { margin: 0.25rem auto 0; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.goal_list li + li { margin: 0.35rem auto 0; } }
#kouka_area ul.box_list li.box ul.ico_list { margin: 2rem auto 0; display: flex; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list { margin: 1.3rem auto 0; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box { width: 7.6rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box { width: 9.65rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box + li.ico_box { margin: 0 0 0 0.8rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box + li.ico_box { margin: 0 0 0 1.1rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box .ico_area { width: 7.6rem; height: 7.6rem; background: #7297b6; display: flex; justify-content: center; align-items: center; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box .ico_area { width: 9.65rem; height: 9.65rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box .ico_area span.ico { width: 2.6rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box .ico_area span.ico { width: 3.3rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box p.title { margin: 0.9rem 0 0; font-size: 15px; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box p.title { margin: 0.8rem 0 0; font-size: 1.3rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box .achieved { margin: 0.75rem auto 0; width: 7.65rem; height: 2.2rem; display: flex; justify-content: center; align-items: center; background: #7297b6; border-radius: 1.1rem; color: #fff; font-size: 1.15rem; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box .achieved { margin: 0.9rem auto 0; width: 9.65rem; height: 2.75rem; border-radius: 1.4rem; font-size: 1.5rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box p.note_mark { margin: 0.2rem 0 0; font-size: 11px; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box p.note_mark { margin: 0.8rem 0 0; font-size: 1.05rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_2 .ico_area { background: #9d7d0f; }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_2 .ico_area span.ico { width: 3.35rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_2 .ico_area span.ico { width: 4.2rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_2 .achieved { background: #9d7d0f; }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_3 .ico_area { background: #005e33; }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_3 .ico_area span.ico { width: 2.55rem; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_3 .ico_area span.ico { width: 3.2rem; } }
#kouka_area ul.box_list li.box ul.ico_list li.ico_box.ico_3 .achieved { background: #005e33; }
#kouka_area ul.box_list li.box p.note { margin: 1.3rem 0 0; text-align: left; font-size: 11px; line-height: 1.4; text-align: left; letter-spacing: 0.05em; font-feature-settings: "palt"; }
@media screen and (max-width: 767px) { #kouka_area ul.box_list li.box p.note { margin: 3.8rem 0 0; font-size: 1.15rem; } }
#kouka_area ul.box_list li.box p.note a { text-decoration: underline; color: #005ab4; }
#kouka_area ul.box_list li.box p.note a:hover { text-decoration: none; }
#kouka_area ul.box_list li.box p.note a img { display: inline-block; margin: 0 .2em; vertical-align: -.1em; width: 1em; }

#movie_area { position: relative; width: 100%; padding: 4rem 0 0; background: #fff; text-align: center; }
@media screen and (max-width: 767px) { #movie_area { padding: 5rem 0 0; } }
#movie_area h2.title { color: #0064d2; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #0064d2 0.3rem solid; }
@media screen and (max-width: 767px) { #movie_area h2.title { font-size: 2rem; padding: 0 0.9rem 1rem; } }
#movie_area p.lead { margin: 1.75rem 0; font-size: 1.05rem; font-weight: bold; text-align: center; }
@media screen and (max-width: 767px) { #movie_area p.lead { margin: 1.5rem 0; padding: 0 1.5em; font-size: 1.4rem; } }
#movie_area .movie { margin: 0 auto; max-width: 32rem; aspect-ratio: 4 / 3; }
@media screen and (max-width: 767px) { #movie_area .movie { aspect-ratio: 9 / 16; } }
#movie_area .movie iframe { width: 100%; height: 100%; }

#casestudy_area { position: relative; width: 100%; padding: 4rem 0 4rem; background: #fff; text-align: center; }
@media screen and (max-width: 767px) { #casestudy_area { padding: 5rem 0 5.7rem; } }
#casestudy_area .scroll_line { position: absolute; top: 0; left: 50%; width: 1px; height: 3.15rem; background: #000; }
@media screen and (max-width: 767px) { #casestudy_area .scroll_line { display: none; } }
#casestudy_area .scroll_line.bottom { top: auto; bottom: 0; }
#casestudy_area .side_text { top: 5.4rem; }
#casestudy_area h2.title { color: #0064d2; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #0064d2 0.3rem solid; }
@media screen and (max-width: 767px) { #casestudy_area h2.title { font-size: 2rem; padding: 0 0.9rem 1rem; } }
#casestudy_area p.lead { margin: 1.75rem 0; font-size: 1.05rem; font-weight: bold; text-align: center; }
@media screen and (max-width: 767px) { #casestudy_area p.lead { margin: 1.5rem 0; font-size: 1.4rem; } }
#casestudy_area .case_main { margin: 4rem auto 0; padding: 0 0 1.65rem; width: 57.1rem; background: #fff; }
@media screen and (max-width: 767px) { #casestudy_area .case_main { margin: 0 auto; padding: 2.5rem 0; box-sizing: border-box; width: 34rem; } }
#casestudy_area .title_area { display: flex; margin: 0 auto 3rem; width: 57.5rem; background: #f1f1f1; }
@media screen and (max-width: 767px) { #casestudy_area .title_area { display: block; margin: 2.5rem auto 3rem; width: 34rem; } }
#casestudy_area h3.title { color: #0064d2; font-size: 1.35rem; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #casestudy_area h3.title { font-size: 2rem; } }
#casestudy_area .image_area { flex: 0 0 calc(350 / 1142 * 100%); }
@media screen and (max-width: 767px) { #casestudy_area .image_area { margin: 1.5rem -1.5rem 1rem; } }
#casestudy_area .text_area { box-sizing: border-box; flex: 1 0 0%; max-width: 100%; padding: 1rem 1.5rem 0; text-align: left; }
@media screen and (max-width: 767px) { #casestudy_area .text_area { width: 100%; margin: 1.5rem auto 0; padding: 1.5rem; } }
#casestudy_area .text_area p.text { margin: 0.75rem 0 0; font-size: 0.85rem; font-weight: bold; line-height: 1.88; letter-spacing: 0.05em; font-feature-settings: "palt"; }
@media screen and (max-width: 767px) { #casestudy_area .text_area p.text { margin: 0; font-size: 1.45rem; } }
#casestudy_area .address_area { display: block; margin: 0.9rem auto 0; padding: 0.6rem 0.75rem 0.6rem 0.75rem; background: #fff; color: #585858; text-align: left; }
@media screen and (max-width: 767px) { #casestudy_area .address_area { margin: 2rem auto 0; padding: 1.4rem 0 1.5rem; } }
#casestudy_area .address_area .address_inner { display: flex; align-items: center; }
@media screen and (max-width: 767px) { #casestudy_area .address_area .address_inner { flex-wrap: wrap; align-items: flex-start; padding: 0 1em; } }
#casestudy_area .address_area h4.title { font-size: 0.7rem; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #casestudy_area .address_area h4.title { width: 100%; font-size: 1.6rem; text-align: center; } }
#casestudy_area .address_area p.address_title { margin: 0 0 0 0.9rem; width: 3rem; height: 1.05rem; background: #585858; border-radius: 0.15rem; color: #fff; font-size: 0.65rem; font-weight: bold; text-align: center; }
@media screen and (max-width: 767px) { #casestudy_area .address_area p.address_title { margin: 1.25rem 0 0; width: 4.65rem; height: 2.1rem; font-size: 1.35rem; } }
#casestudy_area .address_area p.address { margin: 0 0 0 0.45rem; font-size: 0.7rem; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #casestudy_area .address_area p.address { width: 22rem; margin: 1.25rem 0 0 1rem; font-size: 1.35rem; line-height: 1.524; text-align: left; } }
#casestudy_area .address_area p.address a { position: relative; color: #585858; transition: all 0.3s ease-out; padding: 0 0 0.15rem 0; border-bottom: #585858 1px solid; line-height: 1; }
#casestudy_area .address_area p.address a.over { border-bottom: 0px; }
#casestudy_area .address_area p.address a:after { content: ''; position: absolute; top: 0.15rem; right: -1.2rem; width: 0.95rem; height: 0.95rem; background: url(../img/ico_link.svg) no-repeat; background-size: cover; }
@media screen and (max-width: 767px) { #casestudy_area .address_area p.address a:after { top: 0.4rem; right: -2rem; width: 1.55rem; height: 1.55rem; } }
@media screen and (max-width: 767px) { #casestudy_area .address_area + .text_area { margin: 3.5rem auto -0.75rem; }
  #casestudy_area .address_area + .text_area h3.title { text-align: center; } }
#casestudy_area h3.news_title { margin: 3rem 0 1rem; font-size: 1rem; font-weight: bold; text-align: center; }
@media screen and (max-width: 767px) { #casestudy_area h3.news_title { margin-bottom: 1.5rem; font-size: 1.7rem; } }
#casestudy_area ul.news_list { margin: 0 auto; width: 48rem; border-top: #cfcfcf 1px solid; }
@media screen and (max-width: 767px) { #casestudy_area ul.news_list { margin: 0rem auto 0; width: 100%; } }
#casestudy_area ul.news_list-more { margin-top: 0; border-top: none; max-height: 0; overflow: hidden; opacity: 0; transition-property: all; transition-duration: .3s; }
#casestudy_area ul.news_list-more.is-open { max-height: 9999px; opacity: 1; }
#casestudy_area ul.news_list li { margin: 0 auto 0; padding: 1rem 0; border-bottom: #cfcfcf 1px solid; display: flex; }
@media screen and (max-width: 767px) { #casestudy_area ul.news_list li { padding: 1.5rem 0; display: block; } }
#casestudy_area ul.news_list li .news_date_area { flex: 0 0 8em; font-size: 0.7rem; line-height: 1.647; }
@media screen and (max-width: 767px) { #casestudy_area ul.news_list li .news_date_area { width: 100%; font-size: 1.4rem; text-align: left; } }
#casestudy_area ul.news_list li .news_date_area a.over { opacity: 0.6; transition: opacity 0.3s ease-out; }
#casestudy_area ul.news_list li .news_text_area { box-sizing: border-box; flex: 1 0 0%; max-width: 100%; margin: 0 0 0 1.85rem; }
@media screen and (max-width: 767px) { #casestudy_area ul.news_list li .news_text_area { width: 100%; margin: 0.5rem auto 0; } }
#casestudy_area ul.news_list li .news_text_area span.news_text { display: block; text-align: left; font-size: 0.7rem; line-height: 1.647; letter-spacing: 0.05em; font-feature-settings: "palt"; transition: color 0.3s ease-out; }
@media screen and (max-width: 767px) { #casestudy_area ul.news_list li .news_text_area span.news_text { font-size: 1.4rem; } }
#casestudy_area ul.news_list li .news_text_area span.link { display: block; text-align: left; margin: 0.4rem 0 0; color: #0064d2; font-size: 0.7rem; font-weight: bold; line-height: 1; text-decoration: underline; transition: color 0.3s ease-out; }
@media screen and (max-width: 767px) { #casestudy_area ul.news_list li .news_text_area span.link { margin: 1rem auto 0; text-align: right; font-size: 1.4rem; } }
#casestudy_area ul.news_list li .news_text_area span.link img { display: inline-block; width: 1.2em; margin-left: .4em; vertical-align: -.2em; }
#casestudy_area ul.news_list li .news_text_area a.over span.news_text { color: #666; }
#casestudy_area ul.news_list li .news_text_area a.over span.link { color: #5e9adc; text-decoration: none; }
#casestudy_area .news_btn { position: relative; width: 48rem; margin: 0 auto; padding: 0.75rem 0; font-size: 17px; font-weight: bold; color: #0064d2; cursor: pointer; }
#casestudy_area .news_btn span:nth-child(2) { display: none; }
#casestudy_area .news_btn span i { display: inline-block; margin-left: 5px; width: 24px; height: 24px; font-style: normal; vertical-align: -1px; }
@media screen and (max-width: 767px) { #casestudy_area .news_btn { width: 100%; padding: 1rem 0; font-size: 1.45rem; }
  #casestudy_area .news_btn span i { margin-left: 0; vertical-align: 0; } }
#casestudy_area .news_btn.is-open span:nth-child(1) { display: none; }
#casestudy_area .news_btn.is-open span:nth-child(2) { display: inline; }
#casestudy_area .credit_area { margin: 3rem auto 0; }
@media screen and (max-width: 767px) { #casestudy_area .credit_area { margin: 3.1rem auto 0; } }
#casestudy_area .credit_area p.credit_title { font-size: 12px; font-weight: 500; line-height: 1.4; }
#casestudy_area .credit_area p.credit_title strong { display: block; margin-bottom: .2em; font-size: 20px; }
@media screen and (max-width: 767px) { #casestudy_area .credit_area p.credit_title { font-size: 1.1rem; }
  #casestudy_area .credit_area p.credit_title strong { font-size: 1.8rem; } }
#casestudy_area .credit_area ul.bn_area { margin: 1.1rem auto 0; display: flex; justify-content: center; }
@media screen and (max-width: 767px) { #casestudy_area .credit_area ul.bn_area { margin: 1.8rem auto 0; } }
#casestudy_area .credit_area ul.bn_area li { width: 14.25rem; }
@media screen and (max-width: 767px) { #casestudy_area .credit_area ul.bn_area li { width: 17.3rem; } }
#casestudy_area .credit_area ul.bn_area li a { position: relative; display: block; transition: opacity 0.3s ease-out; }
#casestudy_area .credit_area ul.bn_area li a.over { opacity: 0.6; }
#casestudy_area .credit_area ul.bn_area li a img { border: #000 1px solid; }
#casestudy_area .credit_area ul.bn_area li a img.newwin { position: absolute; right: 1em; top: 1em; width: 1.3em; border: none; }
#casestudy_area .credit_area ul.bn_area li + li { margin: 0 0 0 0.8rem; }
@media screen and (max-width: 767px) { #casestudy_area .credit_area ul.bn_area li + li { margin: 0 0 0 1.05rem; } }
#casestudy_area .credit_area .credit { max-width: 90%; width: 48rem; margin: 1.25rem auto 0; font-size: 12px; font-weight: 500; line-height: 2.0; text-align: left; }
#casestudy_area .credit_area .credit dl { display: table-row; }
#casestudy_area .credit_area .credit dl dt, #casestudy_area .credit_area .credit dl dd { display: table-cell; vertical-align: top; }
#casestudy_area .credit_area .credit dl dt { white-space: nowrap; text-align: right; }
#casestudy_area .credit_area .credit a { text-decoration: underline; color: #005ab4; }
#casestudy_area .credit_area .credit a img { display: inline-block; margin: 0 .2em; vertical-align: -.1em; width: 1em; }
@media screen and (max-width: 767px) { #casestudy_area .credit_area .credit { max-width: none; width: auto; margin: 1.9rem auto 0; font-size: 1.05rem; line-height: 1.591; letter-spacing: 0.05em; font-feature-settings: "palt"; }
  #casestudy_area .credit_area .credit dl + dl dt, #casestudy_area .credit_area .credit dl + dl dd { padding-top: 1em; } }
#casestudy_area .report_list { width: 60rem; display: flex; flex-wrap: wrap; margin: 0 auto 0; margin-bottom: -1.5rem; text-align: left; }
@media screen and (max-width: 767px) { #casestudy_area .report_list { display: block; width: 34rem; margin-bottom: -2rem; } }
#casestudy_area .report_list > li { box-sizing: border-box; flex: 0 0 50%; max-width: 50%; margin-bottom: 1.5rem; padding: 0 1.25rem; }
@media screen and (max-width: 767px) { #casestudy_area .report_list > li { margin-bottom: 2rem; padding: 0; max-width: none; } }
#casestudy_area .report_list .touch { transition: opacity 0.3s ease-out; display: flex; }
#casestudy_area .report_list a.over { opacity: .75; }
#casestudy_area .report_image_area { flex: 0 0 calc(252 / 550 * 100%); width: calc(252 / 550 * 100%); }
@media screen and (max-width: 767px) { #casestudy_area .report_image_area { flex: 0 0 calc(200 / 550 * 100%); width: calc(200 / 550 * 100%); } }
#casestudy_area .report_image_area img { height: 100%; }
#casestudy_area .report_text_area { flex: 1 0 0%; max-width: 100%; margin-left: 1rem; }
#casestudy_area .report_text_area .date { font-size: 0.7rem; }
@media screen and (max-width: 767px) { #casestudy_area .report_text_area .date { font-size: 0.9rem; } }
#casestudy_area .report_text_area .title { margin: .5em 0; font-size: 0.9rem; }
@media screen and (max-width: 767px) { #casestudy_area .report_text_area .title { margin: .3em 0; font-size: 1.2rem; } }
#casestudy_area .report_text_area .button { display: inline-block; font-size: 0.7rem; color: #0064d2; border-bottom: solid 1px #0064d2; }
@media screen and (max-width: 767px) { #casestudy_area .report_text_area .button { font-size: 0.9rem; } }
#casestudy_area .report_text_area .button a { color: #0064d2; }
#casestudy_area .report_text_area .button img { display: inline-block; width: 1.2em; margin-right: 0.2em; margin-left: 0.2em; vertical-align: -0.2em; }
#casestudy_area .sdgs { display: flex; align-items: center; margin: 0.9rem auto 0; padding: 7px 15px; border: solid 1px #0f67cf; background: #fff; }
@media screen and (max-width: 767px) { #casestudy_area .sdgs { margin-top: 1.5rem; } }
#casestudy_area .sdgs > i { flex: 0 0 2.55rem; margin-right: 0.9rem; }
@media screen and (max-width: 767px) { #casestudy_area .sdgs > i { flex: 0 0 5.1rem; margin-right: 1.5rem; } }
#casestudy_area .sdgs > span { font-size: 0.95rem; font-weight: bold; }
@media screen and (max-width: 767px) { #casestudy_area .sdgs > span { font-size: 1.5rem; } }
#casestudy_area .sdgs a { display: inline-block; color: #0064d2; text-decoration: underline; }
#casestudy_area .sdgs a:hover { text-decoration: none; }
#casestudy_area .sdgs a img { display: inline-block; width: .85em; margin-left: 0.3em; vertical-align: -0.1em; }

#report_area { margin: 3.25rem auto 0; width: 60rem; }
@media screen and (max-width: 767px) { #report_area { margin: 4.8rem auto 0; width: 35.5rem; } }
#report_area h3.title { margin-bottom: 0.6rem; padding: 0 1.25rem; color: #fff; font-size: 27px; font-weight: bold; line-height: 1; text-align: left; }
@media screen and (max-width: 767px) { #report_area h3.title { padding: 0 1.5rem; font-size: 2rem; } }
#report_area .desc { padding: 0 1.25rem; font-size: 14px; color: #fff; text-align: left; }
@media screen and (max-width: 767px) { #report_area .desc { padding: 0 1.5rem; font-size: 1.3rem; } }
#report_area .title_line { margin: 0.95rem auto 0; width: 100%; height: 1px; background: #fff; }
@media screen and (max-width: 767px) { #report_area .title_line { height: 0.1rem; } }
#report_area ul.report_list { margin: 0 auto 0; margin-bottom: -2.5rem; display: flex; justify-content: center; flex-wrap: wrap; }
@media screen and (max-width: 767px) { #report_area ul.report_list { margin: 0.3rem auto 0; } }
#report_area ul.report_list li { position: relative; width: 17.85rem; margin: 2rem 0.85rem 0; margin-bottom: 2.5rem; text-align: left; }
@media screen and (max-width: 767px) { #report_area ul.report_list li { width: 31.5rem; height: auto; margin: 0 auto 0; padding: 2rem 0 3.1rem; border-bottom: #fff 0.1rem solid; } }
#report_area ul.report_list li p.date { margin: 1.2rem 0 0; color: #fff; font-size: 14px; font-weight: 400; line-height: 1; }
@media screen and (max-width: 767px) { #report_area ul.report_list li p.date { margin: 2.1rem 0 0; font-size: 1.15rem; } }
#report_area ul.report_list li h4.title { margin: 0.6rem 0 0; color: #fff; font-size: 18px; font-weight: bold; line-height: 1.444; min-height: 2.5rem; }
@media screen and (max-width: 767px) { #report_area ul.report_list li h4.title { margin: 1.25rem 0 0; font-size: 1.5rem; min-height: auto; } }
#report_area ul.report_list li p.text { margin: 0.6rem 0 0; color: #fff; font-size: 14px; font-weight: 400; line-height: 1.733; }
@media screen and (max-width: 767px) { #report_area ul.report_list li p.text { margin: 1.5rem 0 0; font-size: 1.3rem; } }
#report_area ul.report_list li .button { position: absolute; bottom: 0; left: 3.25rem; width: 9.75rem; height: 2rem; border-radius: 0.15rem; background-color: #fff; color: #0064d2; font-size: 0.7rem; font-weight: bold; text-align: center; letter-spacing: 0.01em; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease-out; }
@media screen and (max-width: 767px) { #report_area ul.report_list li .button { position: relative; bottom: auto; left: auto; margin: 1.75rem auto 0; width: 19.5rem; height: 4rem; border-radius: 0.25rem; font-size: 1.3rem; } }
#report_area ul.report_list li .button span.ico { position: absolute; top: 0.8rem; right: 0.5rem; width: 0.3rem; height: 0.45rem; }
@media screen and (max-width: 767px) { #report_area ul.report_list li .button span.ico { top: 1.7rem; right: 1.05rem; width: 0.5rem; height: 0.75rem; } }
#report_area ul.report_list li .button span.ico .path { transition: fill 0.3s ease-out; }
#report_area ul.report_list li a { position: relative; display: block; width: 100%; height: 100%; padding: 0 0 1.5rem; }
#report_area ul.report_list li a.over .button { background: #323232; color: #fff; }
#report_area ul.report_list li a.over .button span.ico .path { fill: #fff; }

#report_detail_area { position: relative; width: 100%; padding: 7.7rem 0 5rem; background: #f1f1f1; text-align: center; }
@media screen and (max-width: 767px) { #report_detail_area { background: #e1e1e1; padding: 7.75rem 0 3.1rem; } }
#report_detail_area .side_text { top: 8rem; }
#report_detail_area .side_logo { position: absolute; top: 7.25rem; right: 0; width: 3.25rem; }
@media screen and (max-width: 767px) { #report_detail_area .side_logo { display: none; } }
#report_detail_area h2.title { color: #0064d2; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #0064d2 0.3rem solid; }
@media screen and (max-width: 767px) { #report_detail_area h2.title { font-size: 2.5rem; padding: 0; border-bottom: 0; } }
#report_detail_area .inner { margin: 3.2rem auto 0; padding: 2.75rem 0 3.1rem; width: 52rem; background: #fff; }
@media screen and (max-width: 767px) { #report_detail_area .inner { margin: 3.8rem auto 0; padding: 2.3rem 0 6.9rem; width: 35.5rem; } }
#report_detail_area .title_area { position: relative; width: 36rem; margin: 0 auto 0; padding: 0 0 0.75rem; }
@media screen and (max-width: 767px) { #report_detail_area .title_area { width: 31.5rem; margin: 0 auto 0; padding: 0 0 1.2rem; } }
#report_detail_area .title_area:after { content: ''; position: absolute; bottom: 0; left: 0.4rem; width: 35.4rem; height: 1px; background: #c9c9c9; }
@media screen and (max-width: 767px) { #report_detail_area .title_area:after { left: 0; width: 100%; } }
#report_detail_area .title_area p.date { color: #585858; font-size: 14px; font-weight: 400; line-height: 1; text-align: left; }
@media screen and (max-width: 767px) { #report_detail_area .title_area p.date { font-size: 1.15rem; } }
#report_detail_area .title_area h3.title { margin: 0.75rem 0 0; color: #0064d2; font-size: 24px; font-weight: bold; line-height: 1.4; text-align: left; }
@media screen and (max-width: 767px) { #report_detail_area .title_area h3.title { margin: 1rem 0 0; font-size: 1.8rem; } }
#report_detail_area .main_image { margin: 1.6rem auto 0; }
@media screen and (max-width: 767px) { #report_detail_area .main_image { margin: 2.4rem auto 0; width: 31.5rem; } }
#report_detail_area .article_area { margin: 1rem auto 0; width: 36.8rem; }
@media screen and (max-width: 767px) { #report_detail_area .article_area { margin: 3.3rem auto 0; width: 31.5rem; } }
#report_detail_area .article_area p.text { margin: 1rem auto 0; font-size: 17px; line-height: 1.882; text-align: left; letter-spacing: 0.08em; font-feature-settings: "palt"; }
@media screen and (max-width: 767px) { #report_detail_area .article_area p.text { margin: 1rem auto 0; font-size: 1.45rem; } }
#report_detail_area .article_area p.note { margin: 0.3rem auto 0; font-size: 15px; line-height: 1.4; text-align: left; }
@media screen and (max-width: 767px) { #report_detail_area .article_area p.note { margin: 0.6rem auto 0; font-size: 1.2rem; } }
#report_detail_area .article_area .image { margin: 1.25rem auto 0; width: 100%; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image { margin: 1.6rem auto 0; } }
#report_detail_area .article_area .image img { width: 24.5rem; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image img { width: 100%; } }
#report_detail_area .article_area .image img.wide { width: 35.65rem; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image img.wide { width: 100%; } }
#report_detail_area .article_area .image .image_box { display: flex; align-items: flex-start; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image .image_box { flex-wrap: wrap; } }
#report_detail_area .article_area .image .image_box img { width: 17.6rem; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image .image_box img { width: 100%; } }
#report_detail_area .article_area .image .image_box img + img { margin: 0 0 0 0.5rem; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image .image_box img + img { margin: 0.7rem auto 0; } }
#report_detail_area .article_area .image p.caption { margin: 0.4rem auto 0; font-size: 16px; font-weight: 500; line-height: 1.4; }
@media screen and (max-width: 767px) { #report_detail_area .article_area .image p.caption { margin: 0.8rem auto 0; font-size: 1.2rem; } }
#report_detail_area .page_navi_area { position: relative; margin: 1.4rem auto 0; width: 52rem; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area { margin: 7rem auto 0; width: 35.5rem; } }
#report_detail_area .page_navi_area .back { display: inline-block; margin: 0 auto 0; }
#report_detail_area .page_navi_area .back a { display: block; color: #0064d2; font-size: 15px; font-weight: bold; line-height: 1; padding: 0.25rem 0 0.25rem; border-bottom: #0064d2 1px solid; transition: opacity 0.3s ease-out; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .back a { font-size: 1.25rem; padding: 0.6rem 0 0.6rem; } }
#report_detail_area .page_navi_area .back a.over { opacity: 0.7; border-bottom: transparent 1px solid; }
#report_detail_area .page_navi_area .navi { position: absolute; top: 0; left: 1.7rem; width: 6.1rem; height: 1.3rem; display: flex; justify-content: center; align-items: center; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .navi { top: -4.7rem; left: 3.5rem; width: 3.5rem; height: 2.4rem; } }
#report_detail_area .page_navi_area .navi a { position: relative; display: block; width: 100%; height: 100%; padding: 0 0 0 2.4rem; display: flex; justify-content: center; align-items: center; color: #0064d2; font-size: 15px; font-weight: bold; line-height: 1; white-space: nowrap; transition: opacity 0.3s ease-out; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .navi a { font-size: 1.25rem; padding: 0 0 0 4.35rem; } }
#report_detail_area .page_navi_area .navi a.over { opacity: 0.7; }
#report_detail_area .page_navi_area .navi a:after { content: ''; position: absolute; top: 0; left: 0; width: 1.25rem; height: 100%; background: url(../img/btn_page_arr.svg) left center no-repeat; background-size: 1.25rem 0.375rem; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .navi a:after { width: 2.8rem; background-size: 2.8rem 0.85rem; } }
#report_detail_area .page_navi_area .navi.next { left: auto; right: 1.7rem; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .navi.next { right: 3.5rem; } }
#report_detail_area .page_navi_area .navi.next a { padding: 0 2.4rem 0 0; }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .navi.next a { padding: 0 4.35rem 0 0; } }
#report_detail_area .page_navi_area .navi.next a:after { content: ''; position: absolute; top: 0; left: auto; right: 0; width: 1.25rem; height: 100%; background: url(../img/btn_page_arr.svg) right center no-repeat; background-size: 1.25rem 0.375rem; transform: rotate(180deg); }
@media screen and (max-width: 767px) { #report_detail_area .page_navi_area .navi.next a:after { width: 2.8rem; background-size: 2.8rem 0.85rem; } }

#tech_area { position: relative; width: 100%; padding: 5rem 0 5rem; background: #f1f1f1; text-align: center; }
@media screen and (max-width: 767px) { #tech_area { padding: 5.4rem 0 3.45rem; } }
#tech_area .scroll_line { position: absolute; top: 0; left: 50%; width: 1px; height: 3.15rem; background: #000; }
@media screen and (max-width: 767px) { #tech_area .scroll_line { display: none; } }
#tech_area .side_text { top: 5.5rem; width: 0.85rem; }
#tech_area h2.title { color: #0064d2; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #0064d2 0.3rem solid; }
@media screen and (max-width: 767px) { #tech_area h2.title { font-size: 2rem; padding: 0 0.9rem 1rem; } }
#tech_area .inner { position: relative; margin: 3.75rem auto 0; padding: 3.75rem 0 3.7rem; width: 55rem; background: #fff; }
@media screen and (max-width: 767px) { #tech_area .inner { margin: 4.4rem auto 0; padding: 2.35rem 0 3.5rem; width: 34.5rem; } }
#tech_area .box_title_list { display: flex; justify-content: center; }
@media print, screen and (min-width: 767px) { #tech_area .box_title_list { display: none; } }
#tech_area .box_title_list h3.title { margin: 0; width: 15.1rem; height: 2.35rem; background: #0064d2; color: #fff; font-size: 21px; font-weight: bold; display: flex; justify-content: center; align-items: center; }
#tech_area .box_title_list h3.title + h3.title { margin: 0 0 0 1.45rem; }
@media screen and (max-width: 767px) { #tech_area .box_title_list h3.title { font-size: 1.05rem; } }
#tech_area .main_image { position: absolute; top: 8rem; left: 1.2rem; width: 52.6rem; height: 15.55rem; background: url(../img/tech_image_1.jpg) no-repeat; background-size: 52.6rem 15.55rem; }
@media screen and (max-width: 767px) { #tech_area .main_image { position: relative; top: 1.3rem; left: 0; width: 34.5rem; height: 12.7rem; background: url(../img/tech_image_1_sp.jpg) no-repeat; background-size: 34.5rem 12.7rem; } }
#tech_area ul.box_list { display: flex; justify-content: center; }
@media screen and (max-width: 767px) { #tech_area ul.box_list { flex-wrap: wrap; margin: 3.5rem auto 0; width: 31.5rem; } }
#tech_area ul.box_list > li { position: relative; width: 22.8rem; margin: 0 1.1rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li { width: 100%; margin: 0 auto 0; }
  #tech_area ul.box_list > li + li { margin: 4.8rem auto 0; } }
#tech_area ul.box_list > li h3.title { width: 100%; height: 2.85rem; background: #0064d2; color: #fff; font-size: 1.25rem; font-weight: bold; display: flex; justify-content: center; align-items: center; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li h3.title { height: 4.25rem; font-size: 1.75rem; } }
#tech_area ul.box_list > li .image { position: absolute; top: 6.5rem; left: -1.5rem; width: 34.5rem; height: 24.95rem; background: url(../img/tech_image_1_1_sp.jpg) no-repeat; background-size: 34.5rem 24.95rem; }
@media print, screen and (min-width: 767px) { #tech_area ul.box_list > li .image { display: none; } }
#tech_area ul.box_list > li p.text { position: relative; margin: 17rem auto 0; width: 19.5rem; font-size: 16px; font-weight: bold; line-height: 1.441; text-align: left; letter-spacing: 0.05em; font-feature-settings: "palt"; min-height: 4.7665rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li p.text { margin: 22rem auto 0; width: 100%; font-size: 1.4rem; line-height: 1.536; min-height: auto; } }
#tech_area ul.box_list > li p.text sup { font-weight: 400; }
#tech_area ul.box_list > li p.note { margin: 0.8rem auto 0; width: 19.5rem; font-size: 10px; line-height: 1.4; text-align: left; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li p.note { margin: 0.65rem auto 0; width: 100%; font-size: 1.15rem; } }
#tech_area ul.box_list > li .mark_area { margin: 1.35rem auto 0; padding: 0.9rem 0 0.5rem; box-sizing: border-box; width: 100%; background: #f3f3f3; display: flex; align-items: center; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .mark_area { margin: 1.75rem auto 0; padding: 1.2rem 0 0.8rem; } }
#tech_area ul.box_list > li .mark_area .logo_area { width: 9rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .mark_area .logo_area { width: 12.45rem; } }
#tech_area ul.box_list > li .mark_area .logo_area span.logo { display: block; width: 6.05rem; margin: 0 0 0 1.2rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .mark_area .logo_area span.logo { width: 8.3rem; margin: 0 0 0 1.55rem; } }
#tech_area ul.box_list > li .mark_area .text_area { width: 12.3rem; text-align: left; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .mark_area .text_area { width: 17.7rem; } }
#tech_area ul.box_list > li .mark_area .text_area h4.title { font-size: 15px; font-weight: bold; line-height: 1; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .mark_area .text_area h4.title { font-size: 1.15rem; } }
#tech_area ul.box_list > li .mark_area .text_area p.mark_text { margin: 0.5rem 0 0; font-size: 15px; line-height: 1.5; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .mark_area .text_area p.mark_text { margin: 0.8rem 0 0; font-size: 1.15rem; } }
#tech_area ul.box_list > li ul.award { margin: 0.85rem auto 0; min-height: 2em; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li ul.award { margin: 1.2rem auto 0; }
  #tech_area ul.box_list > li ul.award.forpc { display: none; } }
#tech_area ul.box_list > li ul.award li { font-size: 13px; font-weight: bold; line-height: 1.4; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li ul.award li { font-size: 1.15rem; line-height: 1.6; } }
#tech_area ul.box_list > li ul.award li + li { margin: 0.5rem auto 0; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li ul.award li + li { margin: 1rem auto 0; } }
#tech_area ul.box_list > li ul.award li a { text-decoration: underline; color: #005ab4; }
#tech_area ul.box_list > li ul.award li a img { display: inline-block; width: 1.2em; margin-left: .3em; vertical-align: -.1em; }
#tech_area ul.box_list > li .link_blank { margin: 0.85rem auto 0; height: 2.3rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .link_blank { display: none; } }
#tech_area ul.box_list > li .button { margin: 1.3rem auto 0; width: 16.2rem; height: 2.8rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .button { margin: 3rem auto 0; width: 20.35rem; height: 4rem; } }
#tech_area ul.box_list > li .button a { position: relative; border-radius: 0.15rem; background-color: #585858; color: #fff; font-size: 0.9rem; font-weight: bold; text-align: center; letter-spacing: 0.01em; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; transition: all 0.3s ease-out; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .button a { font-size: 1.2rem; } }
#tech_area ul.box_list > li .button a span.ico { position: absolute; top: 0.9rem; right: 0.6rem; width: 0.9rem; height: 0.9rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li .button a span.ico { top: 1.4rem; right: 0.75rem; width: 1.4rem; height: 1.4rem; } }
#tech_area ul.box_list > li .button a.over { background-color: #0064d2; }
#tech_area ul.box_list > li.box_2 .image { top: 6.5rem; left: 0; width: 31.5rem; height: 18.1rem; background: url(../img/tech_image_1_2_sp.jpg) no-repeat; background-size: 31.5rem 18.1rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li.box_2 p.text { margin: 21rem auto 0; } }
#tech_area ul.box_list > li.box_2 .mark_area .logo_area { width: 7.05rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li.box_2 .mark_area .logo_area { width: 8.9rem; } }
#tech_area ul.box_list > li.box_2 .mark_area .logo_area span.logo { width: 4rem; margin: 0 0 0 1.4rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li.box_2 .mark_area .logo_area span.logo { width: 6.15rem; margin: 0 0 0 1.1rem; } }
#tech_area ul.box_list > li.box_2 .text_area { width: 15rem; }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li.box_2 .text_area { width: 21.5rem; } }
@media screen and (max-width: 767px) { #tech_area ul.box_list > li.box_2 .button { margin: 2.25rem auto 0; } }
#tech_area .link_office { margin: 2.8rem auto 0; width: 47.95rem; height: 5.4rem; }
@media screen and (max-width: 767px) { #tech_area .link_office { margin: 2.2rem auto 0; width: 31.5rem; height: auto; } }
#tech_area .link_office a { position: relative; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background: #d5e9ff; border: #0064d2 1px solid; border-radius: 0.15rem; transition: opacity 0.3s ease-out; }
@media screen and (max-width: 767px) { #tech_area .link_office a { display: block; padding: 1.2rem 0 1.1rem; } }
#tech_area .link_office a.over { opacity: 0.6; }
#tech_area .link_office a span.title { display: block; font-size: 1.35rem; font-weight: bold; color: #0064d2; font-style: italic; }
@media screen and (max-width: 767px) { #tech_area .link_office a span.title { font-size: 2.15rem; } }
#tech_area .link_office a span.text { display: block; margin: 0 0 0 1.5rem; font-size: 0.85rem; font-weight: bold; line-height: 1.529; text-align: left; letter-spacing: 0.05em; font-feature-settings: "palt"; }
@media screen and (max-width: 767px) { #tech_area .link_office a span.text { margin: 0.3rem auto 0; font-size: 1.35rem; line-height: 1.333; text-align: center; } }
#tech_area .link_office a span.ico { position: absolute; top: 2.1rem; right: 1.5rem; width: 1.1rem; height: 1.1rem; }
@media screen and (max-width: 767px) { #tech_area .link_office a span.ico { top: 5rem; right: 1rem; width: 1.7rem; height: 1.7rem; } }

#upcycle_area { position: relative; width: 100%; padding: 5rem 0 5rem; background: #f1f1f1; text-align: center; }
@media screen and (max-width: 767px) { #upcycle_area { padding: 5.4rem 0 3.45rem; } }
#upcycle_area .side_text { top: 5.5rem; width: 0.85rem; }
#upcycle_area h2.title { color: #0064d2; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #0064d2 0.3rem solid; }
@media screen and (max-width: 767px) { #upcycle_area h2.title { font-size: 2rem; padding: 0 0.9rem 1rem; } }
#upcycle_area .inner { position: relative; margin: 3.75rem auto 0; width: 60rem; text-align: left; }
@media screen and (max-width: 767px) { #upcycle_area .inner { margin: 4.4rem auto 0; width: 35.5rem; } }
#upcycle_area .items { display: flex; flex-wrap: wrap; margin: 0 -0.8rem -1.6rem; }
@media screen and (max-width: 767px) { #upcycle_area .items { display: block; margin: 0 0 -2rem; } }
#upcycle_area .item { box-sizing: border-box; flex: 0 0 calc(1 / 3 * 100% - 1.6rem); margin: 0 0.8rem 1.6rem; padding: 1.8rem 1.6rem; background: #fff; }
@media screen and (max-width: 767px) { #upcycle_area .item { margin: 0 0 2rem; padding: 2rem; } }
#upcycle_area .item_title { margin: 1em 0; color: #0064d2; font-size: 20px; font-weight: bold; line-height: 1; text-align: center; }
@media screen and (max-width: 767px) { #upcycle_area .item_title { font-size: 1.8rem; } }
#upcycle_area .item_title sup { display: inline-block; vertical-align: top; font-size: 11px; color: #000; }
@media screen and (max-width: 767px) { #upcycle_area .item_title sup { font-size: 1rem; } }
#upcycle_area .item_text { font-size: 15px; line-height: 1.7; }
@media screen and (max-width: 767px) { #upcycle_area .item_text { font-size: 1.3rem; } }
#upcycle_area .item_notes { margin-top: .5em; font-size: 11px; line-height: 1.4; }
@media screen and (max-width: 767px) { #upcycle_area .item_notes { font-size: 1rem; } }

#info_area { position: relative; width: 100%; padding: 5rem 0 5rem; background: #0064d2; text-align: center; }
@media screen and (max-width: 767px) { #info_area { padding: 3.7rem 0 3.5rem; } }
#info_area .side_text { top: 3.3rem; width: 0.9rem; }
#info_area h2.title { color: #fff; font-size: 38px; font-weight: bold; line-height: 1; letter-spacing: 0.01em; display: inline-block; padding: 0 1.2rem 1rem; border-bottom: #fff 0.3rem solid; }
@media screen and (max-width: 767px) { #info_area h2.title { font-size: 2rem; padding: 0 0.9rem 1rem; } }
#info_area .info_box { margin: 2.8rem auto 0; display: flex; justify-content: center; }
@media screen and (max-width: 767px) { #info_area .info_box { flex-wrap: wrap; margin: 3rem auto 0; } }
#info_area .info_box .box { margin: 0 0.55rem; width: 20.6rem; border: #fff 0.1rem solid; box-sizing: border-box; background: #fff; }
@media screen and (max-width: 767px) { #info_area .info_box .box { width: 31.5rem; margin: 0 auto 0; }
  #info_area .info_box .box + .box { margin: 1.85rem auto 0; } }
#info_area .info_box .box h3.title { width: 100%; height: 2.25rem; background: #fff; color: #0064d2; font-size: 0.85rem; font-weight: bold; display: flex; justify-content: center; align-items: center; }
@media screen and (min-width: 768px) and (max-width: 1247px) { #info_area .info_box .box h3.title { font-size: 14px; } }
@media screen and (max-width: 767px) { #info_area .info_box .box h3.title { height: 3.45rem; font-size: 1.5rem; } }
#info_area .info_box .box .inner { position: relative; background: #0064d2; height: 8.85rem; display: flex; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; }
@media screen and (max-width: 767px) { #info_area .info_box .box .inner { height: 13.1rem; } }
#info_area .info_box .box p.text { margin: 0; color: #fff; font-size: 0.7rem; font-weight: 500; line-height: 1.571; letter-spacing: 0.05em; font-feature-settings: "palt"; }
@media screen and (min-width: 768px) and (max-width: 1247px) { #info_area .info_box .box p.text { font-size: 11px; } }
@media screen and (max-width: 767px) { #info_area .info_box .box p.text { font-size: 1.1rem; white-space: nowrap; } }
#info_area .info_box .box p.text a { color: #fff; }
#info_area .info_box .box .button { margin: 1rem 0 0; width: 11rem; height: 2.85rem; }
@media screen and (max-width: 767px) { #info_area .info_box .box .button { margin: 2rem auto 0; width: 16.8rem; height: 4.4rem; } }
#info_area .info_box .box .button a { position: relative; border-radius: 0.15rem; background-color: #fff; color: #0064d2; font-size: 0.75rem; font-weight: bold; text-align: center; letter-spacing: 0.01em; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; box-sizing: border-box; transition: all 0.3s ease-out; }
@media screen and (min-width: 768px) and (max-width: 1247px) { #info_area .info_box .box .button a { font-size: 12px; } }
@media screen and (max-width: 767px) { #info_area .info_box .box .button a { font-size: 1.15rem; } }
#info_area .info_box .box .button a span.ico { position: absolute; top: 50%; transform: translateY(-50%); right: 0.5rem; width: 0.9rem; height: 0.9rem; }
@media screen and (max-width: 767px) { #info_area .info_box .box .button a span.ico { right: 0.5rem; width: 1.4rem; height: 1.4rem; } }
#info_area .info_box .box .button a span.ico .path { transition: all 0.3s ease-out; }
#info_area .info_box .box .button a.over { background-color: #323232; color: #fff; }
#info_area .info_box .box .button a.over span.ico .path { fill: #fff; }

#footer { background: #fff; }
#footer .totop { position: fixed; bottom: 0.45rem; right: 0.45rem; width: 3.55rem; height: 3.55rem; background: #0064d2; border: #fff 1px solid; border-radius: 2px; box-sizing: border-box; }
@media screen and (max-width: 767px) { #footer .totop { bottom: 7.45rem; right: 0; width: 4.85rem; height: 3.95rem; border: 0px; border-radius: 0; } }
#footer .totop a { display: block; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
#footer .totop span.ico { width: 1.5rem; height: 0.85rem; }
@media screen and (max-width: 767px) { #footer .totop span.ico { width: 2rem; height: 1.15rem; } }
#footer .totop span.ico img { vertical-align: top; }
#footer .copyright_area { margin: 0 auto 0; width: 100%; height: 2.55rem; background: #fff; display: flex; justify-content: center; align-items: center; color: #000; font-size: 13px; font-weight: bold; letter-spacing: 0.01em; }
@media screen and (max-width: 767px) { #footer .copyright_area { margin: 0 auto 0; height: 4.25rem; padding: 0 0 7.5rem; font-size: 1.05rem; } }
#footer .copyright_area.no_contact { padding: 0; }

/*# sourceMappingURL=main.css.map */