@charset "UTF-8";
/*
Theme Name:
Theme URI:
Description:
Author:CrescentWorks.inc
*/
* { text-decoration: none; outline: none; }

b, strong { font-weight: bold; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; vertical-align: baseline; border: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

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

img { font-size: 0; line-height: 0; max-width: 100%; height: auto; vertical-align: bottom; border: none; }

input, textarea, select { border-radius: 0; }

/*
サイトで共通する設定や、
制作に便利なクラスなどをまとめたファイルです。

common / base /variables 内のscssファイルに記述されている変数を使用しています。


*/
html { font-size: 62.5%; overflow: auto; }

body { position: relative; overflow: hidden; min-width: 100%; word-wrap: break-word; overflow-wrap: break-word; -webkit-text-size-adjust: 100%; }

a { display: inline-block; color: #000; }

.f_right { float: right; }

.f_left { float: left; }

.disnon, .none { display: none; }

.block { display: block; }

.bold { font-weight: bold; }

.center { display: block; margin: 0 auto; text-align: center; }

.linkbox { cursor: pointer; transition-duration: .25s; }

.linkbox:hover { transition-duration: .25s; opacity: .8; }

.hov_link:hover { text-decoration: underline; }

.cf { zoom: 1; }

.cf:before, .cf:after { display: block; clear: both; overflow: hidden; height: 0; content: ''; }

.clear { display: block; visibility: hidden; clear: both; height: 0; }

.sp_view { display: none; }

.pc_view { display: block; }

.sp_item { display: none; }

.pc_item { display: initial; }

.mb10 { margin-bottom: 10px; }

.mb20 { margin-bottom: 20px; }

.mb30 { margin-bottom: 30px; }

.mb40 { margin-bottom: 40px; }

.mb60 { margin-bottom: 60px; }

.mb80 { margin-bottom: 80px; }

.mb100 { margin-bottom: 100px; }

.mt10 { margin-top: 10px; }

.mt20 { margin-top: 20px; }

.mt30 { margin-top: 30px; }

.mt40 { margin-top: 40px; }

.mt60 { margin-top: 60px; }

.mt80 { margin-top: 80px; }

.mt100 { margin-top: 100px; }

.note { color: #e03030; }

ul.dot_list li { position: relative; padding-left: 1.2em; }

ul.dot_list li:before { position: absolute; top: 0; left: 0; content: '・'; }

ul.note_list li { position: relative; padding-left: 1.2em; }

ul.note_list li:before { position: absolute; top: 0; left: 0; content: '※'; }

/*
    共通スタイル
*/
*:not(br) { line-height: 1.3; box-sizing: border-box; }

body { font-family: 'Noto Sans JP', 'メイリオ', 'Meiryo', sans-serif; font-size: 1.3rem; font-weight: 300; color: #000; }

.xdebug-var-dump { font-family: arial; font-size: 13px; }

.xdebug-var-dump font { color: #4368af; }

.xdebug-var-dump small { color: #ff6868; }

@-webkit-keyframes sc_on { from { bottom: -50px;
    opacity: 0; }
  to { bottom: 0;
    opacity: 1; } }

@keyframes sc_on { from { bottom: -50px;
    opacity: 0; }
  to { bottom: 0;
    opacity: 1; } }

@-webkit-keyframes hover_move { 0% { top: 14px; }
  100% { top: -55px; } }

@keyframes hover_move { 0% { top: 14px; }
  100% { top: -55px; } }

@-webkit-keyframes hover_move_back { 0% { bottom: -30px; }
  100% { bottom: 14px; } }

@keyframes hover_move_back { 0% { bottom: -30px; }
  100% { bottom: 14px; } }

.sc_item { position: relative; opacity: 0; }

.sc_on { -webkit-animation-name: sc_on; animation-name: sc_on; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }

.site_width { position: relative; width: 960px; margin: auto; }

.sec_ttl { font-size: 2.6rem; font-weight: bold; line-height: 1.4; letter-spacing: 1px; -webkit-font-feature-settings: 'palt'; font-feature-settings: 'palt'; }

.sub_ttl { font-size: 1.8rem; font-weight: bolder; line-height: 1.2; margin-bottom: 30px; padding: 8px; letter-spacing: 1px; border-bottom: solid 2px #0069a6; -webkit-font-feature-settings: 'palt'; font-feature-settings: 'palt'; }

.btn { margin-top: 20px; padding: 8px 24px; color: #fff; background: #3a3734; }

.btn:hover { opacity: .8; box-shadow: 0 0 3px #ccc; }

.stop { overflow: hidden; }

#header { padding: 20px 0; background: #0069a6; }

#header .header_inner { display: flex; align-items: center; }

#header .logo { width: 138px; margin-right: 112px; transition: all .3s; }

#header .logo:hover { transition: all .3s; opacity: .5; }

#header .logo img { width: 100%; }

.menu_btn { float: right; width: 13vw; height: 12vw; padding: 2vw 1vw; }

.menu_btn .menu_trigger { position: relative; display: block; width: 100%; height: 100%; }

.menu_btn .menu_trigger span { position: absolute; left: 0; display: block; width: 100%; height: 1px; transition: all .4s; border-radius: 3px; background-color: #fff; }

.menu_btn .menu_trigger span:nth-of-type(1) { top: 0; }

.menu_btn .menu_trigger span:nth-of-type(2) { top: calc(50% - 1px); }

.menu_btn .menu_trigger span:nth-of-type(3) { bottom: 0; }

.menu_btn.open_ .menu_trigger span:nth-of-type(1) { top: calc(50% - 1px); width: 100%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.menu_btn.open_ .menu_trigger span:nth-of-type(2) { opacity: 0; }

.menu_btn.open_ .menu_trigger span:nth-of-type(3) { top: calc(50% - 1px); width: 100%; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

#sp_menu { position: fixed; z-index: 99; top: 0; left: 0; display: none; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.96); }

#sp_menu .menu_wrapp { padding: 4%; }

#sp_menu .menu_wrapp ul { padding: 0 5%; }

#sp_menu .menu_wrapp ul li a { font-size: 4.2vw; font-weight: bold; display: block; padding: 4% 0; border-bottom: solid 1px #ccc; }

#sp_menu .menu_wrapp ul li a span .small { font-size: 3vw; font-weight: 400; margin-left: 3vw; vertical-align: middle; }

#sp_menu .menu_wrapp .corporate_link { position: relative; width: 90%; margin: 6vw auto 0; transition: all .3s; border: 1px solid #ccc; }

#sp_menu .menu_wrapp .corporate_link:after { position: absolute; top: 4px; right: 4px; width: 10px; height: 8px; content: ''; transition: all .3s; background: url("../img/bt_088m/common/corporate_icon_sp.png") no-repeat center/cover; }

#sp_menu .menu_wrapp .corporate_link a { font-size: 3.5vw; font-weight: bold; width: 100%; padding: 4vw 0; transition: all .3s; text-align: center; letter-spacing: 1px; color: #000; }

#gnav { display: flex; width: 710px; align-items: center; }

#gnav .header_nav { display: flex; align-items: center; }

#gnav li { margin-right: 20px; }

#gnav li:last-child { margin-right: 31px; }

#gnav li a { position: relative; padding-bottom: 5px; letter-spacing: 1px; color: #fff; }

#gnav li a:after { position: absolute; bottom: -3px; left: 0; display: block; width: 100%; height: 1px; content: ''; transition: all .3s; opacity: 0; background: #fff; }

#gnav li a:hover:after { bottom: 0; width: 100%; opacity: 1; }

#gnav .company_site_btn { position: relative; padding: 5.5px 42.5px; transition: all .3s; color: #fff; border: 1px solid #fff; }

#gnav .company_site_btn:before { position: absolute; top: 5px; right: 5px; width: 10px; height: 8px; content: ''; transition: all .3s; background: url("../img/bt_088m/common/company_site_icon.png") no-repeat center/cover; }

#gnav .company_site_btn:hover { transition: all .3s; color: #000; background: #fff; }

#gnav .company_site_btn:hover:before { transition: all .3s; background: url("../img/bt_088m/common/corporate_icon_hover.png") no-repeat center/cover; }

#eyecatch { width: 100%; }

#eyecatch img { width: 100%; }

#pagetop { position: fixed; z-index: 9; right: 50px; bottom: 50px; display: none; overflow: hidden; width: 48px; height: 48px; cursor: pointer; text-align: center; border: solid 1px #000; border-radius: 45px; }

#pagetop span { position: absolute; width: 1px; height: 16px; background: #000; }

#pagetop span:nth-child(1) { top: 14px; left: 17px; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

#pagetop span:nth-child(2) { top: 14px; right: 17px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

#pagetop span:nth-child(3) { bottom: -30px; left: 17px; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

#pagetop span:nth-child(4) { right: 17px; bottom: -30px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

#pagetop:hover span:nth-child(1) { -webkit-animation: hover_move .5s linear alternate; animation: hover_move .5s linear alternate; }

#pagetop:hover span:nth-child(2) { -webkit-animation: hover_move .5s linear alternate; animation: hover_move .5s linear alternate; }

#pagetop:hover span:nth-child(3) { -webkit-animation: hover_move_back .5s linear alternate; animation: hover_move_back .5s linear alternate; }

#pagetop:hover span:nth-child(4) { -webkit-animation: hover_move_back .5s linear alternate; animation: hover_move_back .5s linear alternate; }

#footer { position: relative; padding-top: 86px; background: #0069a6; }

#footer .inner { display: flex; display: -ms-flexbox; padding-bottom: 65px; align-items: center; }

#footer .inner .footer_logo { width: 138px; margin-right: 112px; transition: all .3s; }

#footer .inner .footer_logo:hover { transition: all .3s; opacity: .5; }

#footer .inner .footer_logo img { width: 100%; }

#footer .inner .footer_nav { display: flex; display: -ms-flexbox; width: 710px; align-items: center; -webkit-box-align: center; -ms-flex-align: center; }

#footer .inner .footer_nav ul { display: flex; display: -ms-flexbox; align-items: center; }

#footer .inner .footer_nav ul li { margin-right: 25px; }

#footer .inner .footer_nav ul li:last-child { margin-right: 31px; }

#footer .inner .footer_nav ul li a { font-size: 1.3rem; position: relative; padding-bottom: 5px; color: #fff; }

#footer .inner .footer_nav ul li a:after { position: absolute; bottom: -3px; left: 0; display: block; width: 100%; height: 1px; content: ''; transition: all .3s; opacity: 0; background: #fff; }

#footer .inner .footer_nav ul li a:hover:after { bottom: 0; width: 100%; opacity: 1; }

#footer .inner .footer_nav .corporate_link { position: relative; padding: 5.5px 42.5px; transition: all .3s; color: #fff; border: 1px solid #fff; }

#footer .inner .footer_nav .corporate_link:before { position: absolute; top: 5px; right: 5px; width: 10px; height: 8px; content: ''; transition: all .3s; background: url("../img/bt_088m/common/company_site_icon.png") no-repeat center/cover; }

#footer .inner .footer_nav .corporate_link:hover { transition: all .3s; color: #000; background: #fff; }

#footer .inner .footer_nav .corporate_link:hover:before { transition: all .3s; background: url("../img/bt_088m/common/corporate_icon_hover.png") no-repeat center/cover; }

#footer .copyright { font-size: 1.0rem; padding: 10px; text-align: right; color: #fff; }

.sec1, .sec2, .sec3, .sec4 { padding: 93px 0; }

.over_img { position: absolute; text-align: center; }

.sec1 { background: url("../img/bt_088m/common/sec1_bg.png") no-repeat center/cover; }

.sec1 .sec1_ttl span { display: block; }

.sec1 .sec1_ttl .small { font-size: 2.6rem; font-weight: 400; line-height: 1; margin-bottom: 18px; }

.sec1 .sec1_ttl .inner { display: flex; align-items: center; }

.sec1 .sec1_ttl .inner img { width: 90px; margin-right: 11px; }

.sec1 .sec1_ttl .inner .big { font-size: 6.5rem; font-weight: 400; }

.sec1 .textarea { font-size: 2.1rem; margin: 36px 0 48px; }

.sec1 .sec1_img { width: 722px; }

.sec1 .over_img { top: -40px; right: 0; width: 386px; }

.sec1 .over_img img { width: 379px; }

.sec1 .over_img span { font-size: 1.4rem; font-weight: bold; position: absolute; bottom: 82px; left: 0; width: 100%; }

.sec2 { background: url("../img/bt_088m/common/sec2_bg.png") no-repeat center/cover; }

.sec2 .top_cont { position: relative; }

.sec2 .sec_ttl { padding-left: 300px; }

.sec2 .sec_ttl span { font-size: 1.4rem; font-weight: 300; line-height: 1.8; display: block; margin-top: 28px; }

.sec2 .band_ttl { font-size: 2.0rem; width: 737px; margin: 48px 0 0 auto; padding: 5px 0 5px 80px; letter-spacing: 2px; color: #fff; background: #0069a6; }

.sec2 .over_img { top: -45px; left: 26px; width: 234px; }

.sec2 .over_img img { width: 100%; }

.sec2 .sec2_list { position: relative; margin-top: 45px; }

.sec2 .sec2_list li { display: flex; margin-bottom: 25px; padding: 0 30px 25px; border-bottom: 1px solid #e5e5e5; align-items: center; flex-wrap: wrap; }

.sec2 .sec2_list li span { display: block; }

.sec2 .sec2_list li .number_wrap { width: calc((100% - 85px)/2); margin-right: 85px; }

.sec2 .sec2_list li .number_wrap:nth-of-type(2) { margin-right: 0; }

.sec2 .sec2_list li .ttl { display: flex; height: 52px; margin-bottom: 10px; align-items: center; }

.sec2 .sec2_list li .ttl .number { font-size: 2.2rem; display: flex; width: 46px; height: 46px; margin-right: 12px; color: #fff; background: url("../img/bt_088m/common/sec2_list_number.png") no-repeat center/cover; align-items: center; justify-content: center; }

.sec2 .sec2_list li .ttl .text { font-size: 2.0rem; font-weight: bold; }

.sec2 .sec2_list li p { line-height: 1.4; height: 54px; text-align: justify; }

.sec_option { padding: 52px 0 26px; background: #0069a6; }

.sec_option .option_wrap { display: flex; align-items: center; justify-content: space-between; }

.sec_option .option_wrap span { display: block; }

.sec_option .option_wrap2 { margin-top: 20px; }

.sec_option .option_wrap2 .banner0325 { margin-right: 10px; }

.sec_option .left { width: 200px; margin-right: 115px; }

.sec_option .left .option_ttl { font-size: 3.0rem; display: flex; color: #fff; align-items: baseline; }

.sec_option .left .option_ttl .small { font-size: 1.6rem; font-weight: 300; margin-left: 17px; }

.sec_option .right { display: flex; width: 645px; align-items: center; flex-wrap: wrap; }

.sec_option .right h3 { font-size: 2.0rem; margin-bottom: 8px; color: #fff; }

.sec_option .right p { font-weight: 200; line-height: 1.4; color: #fff; }

.sec_option .right .top_cont { position: relative; width: 585px; margin-bottom: 33px; }

.sec_option .right .top_cont img { position: absolute; right: -10px; bottom: -18px; width: 112px; }

.sec_option .right .top_cont p { margin-bottom: 18px; padding-right: 150px; padding-bottom: 18px; border-bottom: 1px solid #fff; }

.sec_option .right .top_cont span { font-size: 1.1rem; line-height: 1.7; padding-right: 118px; color: #fff; }

.sec_option .right .option_inner { display: flex; align-items: center; }

.sec_option .right .option_inner img { margin-right: 14px; }

.sec_option .right .option_inner:nth-of-type(2) { position: relative; margin-right: 19px; margin-left: -26px; padding-right: 19px; }

.sec_option .right .option_inner:nth-of-type(2):before { position: absolute; top: calc((100% - 104px)/2); right: 0; width: 1px; height: 104px; content: ''; background: #fff; }

.sec_option .right .option_inner:nth-of-type(2) img { width: 107px; height: 106px; margin-top: 14px; }

.sec_option .right .option_inner:nth-of-type(3) img { width: 99px; height: 93px; }

.sec3 { position: relative; padding-top: 137px; }

.sec3 .sec3_bg { position: absolute; z-index: -1; top: -205px; right: 44px; }

.sec3 .top_cont { position: relative; }

.sec3 .top_cont .sec_ttl { margin-bottom: 25px; padding-left: 315px; }

.sec3 .top_cont .sec_ttl img { display: block; width: 227px; margin-top: 5px; }

.sec3 .top_cont .band_ttl { display: flex; padding: 8px 0; padding-left: 315px; background: #0069a6; align-items: center; }

.sec3 .top_cont .band_ttl span { color: #fff; }

.sec3 .top_cont .band_ttl span:nth-of-type(1) { font-size: 1.6rem; }

.sec3 .top_cont .band_ttl span:nth-of-type(2) { font-size: 2.0rem; font-weight: 400; }

.sec3 .top_cont .band_ttl .sec3_arrow { width: 21px; height: 19px; margin: 0 29px; }

.sec3 .top_cont .note { font-size: 1.4rem; font-weight: 300; margin-top: 10px; padding-left: 315px; color: #000; }

.sec3 .top_cont .note .pc_view { display: inline-block; }

.sec3 .top_cont .over_img { top: -88px; left: 0; width: 278px; }

.sec3 .top_cont .over_img img { width: 100%; }

.sec3 .sec3_list { display: flex; margin-top: 53px; align-items: center; }

.sec3 .sec3_list li { width: 312px; height: 221px; margin-right: 12px; }

.sec3 .sec3_list li:last-child { margin-right: 0; }

.sec3 .sec3_list li img { width: 100%; }

.sec3 .text { line-height: 1.4; margin-top: 7px; }

.banner_area { display: flex; padding: 30px 0; background: #f6f6f6; justify-content: center; align-items: center; }

.banner_area .text_area h2 { font-size: 1.8rem; font-weight: 300; padding-bottom: 14px; border-bottom: 1px solid #bababa; }

.banner_area .text_area p { line-height: 1.6; margin-top: 14px; }

.banner_area .triangle { margin-right: -10px; -webkit-transform: rotate(90deg); transform: rotate(90deg); border-right: 35px solid transparent; border-bottom: 15px solid #bababa; border-left: 35px solid transparent; }

.banner_area .img_area img { width: 100%; }

.sec4 .sec_ttl { font-size: 3.0rem; }

.sec4 .sec_ttl span { font-size: 1.6rem; font-weight: 400; margin-left: 7px; }

.sec4 .howto_list { margin-top: 20px; }

.sec4 .howto_list li { display: flex; width: 100%; padding: 15px 0; border-bottom: 1px solid #e5e5e5; align-items: center; }

.sec4 .howto_list li:first-child { border-top: 1px solid #e5e5e5; }

.sec4 .howto_list li .howto_wrap { position: relative; display: flex; width: calc((100% - 15px)/2); margin-left: 15px; align-items: center; }

.sec4 .howto_list li .howto_wrap .number { font-size: 2.2rem; position: absolute; top: -15px; right: 0; display: flex; width: 32px; height: 32px; color: #fff; background: #000; align-items: center; justify-content: center; }

.sec4 .howto_list li .howto_wrap img { width: 127px; height: 122px; margin-right: 20px; }

.sec4 .howto_list li .howto_wrap .right .ttl { font-size: 2.0rem; margin-bottom: 7px; }

.sec4 .howto_list li .howto_wrap .right p { width: 95%; }

.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; top: 0; left: 0; display: block; margin-right: auto; margin-left: auto; }

.slick-track:before, .slick-track:after { display: table; content: ''; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }

[dir='rtl'] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

.slick-slider { padding-bottom: 25px; }

.slick-slider:after { display: block; visibility: hidden; clear: both; height: 0; content: ''; }

.slick-slider .slick-prev, .slick-slider .slick-next { position: absolute !important; z-index: 1; top: 50%; display: block; width: 100px; height: 100px; cursor: pointer; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-indent: -9999px; opacity: .7; border: none; background: transparent; }

.slick-slider .slick-prev:hover, .slick-slider .slick-next:hover { opacity: 1; }

.slick-slider .slick-prev { left: 0; }

.slick-slider .slick-prev:before { -webkit-transform: rotate(-135deg) !important; transform: rotate(-135deg) !important; }

.slick-slider .slick-next { right: 0; }

.slick-slider .slick-dots { position: relative; top: 10px; height: 0; padding: 0; text-align: center; }

.slick-slider .slick-dots li { display: inline-block; }

.slick-slider .slick-dots li button { width: 12px; height: 12px; margin: 5px; padding: 0; text-indent: -9999px; border: none; border-radius: 50%; background: #ccc; }

.slick-slider .slick-dots li.slick-active button { background: #0069a6; }

@-webkit-keyframes lum-fade { 0% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes lum-fade { 0% { opacity: 0; }
  100% { opacity: 1; } }

@-webkit-keyframes lum-fadeZoom { 0% { -webkit-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0; }
  100% { -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }

@keyframes lum-fadeZoom { 0% { -webkit-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0; }
  100% { -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }

@-webkit-keyframes lum-loader-rotate { 0% { -webkit-transform: translate(-50%, -50%) rotate(0);
    transform: translate(-50%, -50%) rotate(0); }
  50% { -webkit-transform: translate(-50%, -50%) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(-180deg); }
  100% { -webkit-transform: translate(-50%, -50%) rotate(-360deg);
    transform: translate(-50%, -50%) rotate(-360deg); } }

@keyframes lum-loader-rotate { 0% { -webkit-transform: translate(-50%, -50%) rotate(0);
    transform: translate(-50%, -50%) rotate(0); }
  50% { -webkit-transform: translate(-50%, -50%) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(-180deg); }
  100% { -webkit-transform: translate(-50%, -50%) rotate(-360deg);
    transform: translate(-50%, -50%) rotate(-360deg); } }

@-webkit-keyframes lum-loader-before { 0% { -webkit-transform: scale(1);
    transform: scale(1); }
  10% { -webkit-transform: scale(1.2) translateX(6px);
    transform: scale(1.2) translateX(6px); }
  25% { -webkit-transform: scale(1.3) translateX(8px);
    transform: scale(1.3) translateX(8px); }
  40% { -webkit-transform: scale(1.2) translateX(6px);
    transform: scale(1.2) translateX(6px); }
  50% { -webkit-transform: scale(1);
    transform: scale(1); }
  60% { -webkit-transform: scale(0.8) translateX(6px);
    transform: scale(0.8) translateX(6px); }
  75% { -webkit-transform: scale(0.7) translateX(8px);
    transform: scale(0.7) translateX(8px); }
  90% { -webkit-transform: scale(0.8) translateX(6px);
    transform: scale(0.8) translateX(6px); }
  100% { -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes lum-loader-before { 0% { -webkit-transform: scale(1);
    transform: scale(1); }
  10% { -webkit-transform: scale(1.2) translateX(6px);
    transform: scale(1.2) translateX(6px); }
  25% { -webkit-transform: scale(1.3) translateX(8px);
    transform: scale(1.3) translateX(8px); }
  40% { -webkit-transform: scale(1.2) translateX(6px);
    transform: scale(1.2) translateX(6px); }
  50% { -webkit-transform: scale(1);
    transform: scale(1); }
  60% { -webkit-transform: scale(0.8) translateX(6px);
    transform: scale(0.8) translateX(6px); }
  75% { -webkit-transform: scale(0.7) translateX(8px);
    transform: scale(0.7) translateX(8px); }
  90% { -webkit-transform: scale(0.8) translateX(6px);
    transform: scale(0.8) translateX(6px); }
  100% { -webkit-transform: scale(1);
    transform: scale(1); } }

@-webkit-keyframes lum-loader-after { 0% { -webkit-transform: scale(1);
    transform: scale(1); }
  10% { -webkit-transform: scale(1.2) translateX(-6px);
    transform: scale(1.2) translateX(-6px); }
  25% { -webkit-transform: scale(1.3) translateX(-8px);
    transform: scale(1.3) translateX(-8px); }
  40% { -webkit-transform: scale(1.2) translateX(-6px);
    transform: scale(1.2) translateX(-6px); }
  50% { -webkit-transform: scale(1);
    transform: scale(1); }
  60% { -webkit-transform: scale(0.8) translateX(-6px);
    transform: scale(0.8) translateX(-6px); }
  75% { -webkit-transform: scale(0.7) translateX(-8px);
    transform: scale(0.7) translateX(-8px); }
  90% { -webkit-transform: scale(0.8) translateX(-6px);
    transform: scale(0.8) translateX(-6px); }
  100% { -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes lum-loader-after { 0% { -webkit-transform: scale(1);
    transform: scale(1); }
  10% { -webkit-transform: scale(1.2) translateX(-6px);
    transform: scale(1.2) translateX(-6px); }
  25% { -webkit-transform: scale(1.3) translateX(-8px);
    transform: scale(1.3) translateX(-8px); }
  40% { -webkit-transform: scale(1.2) translateX(-6px);
    transform: scale(1.2) translateX(-6px); }
  50% { -webkit-transform: scale(1);
    transform: scale(1); }
  60% { -webkit-transform: scale(0.8) translateX(-6px);
    transform: scale(0.8) translateX(-6px); }
  75% { -webkit-transform: scale(0.7) translateX(-8px);
    transform: scale(0.7) translateX(-8px); }
  90% { -webkit-transform: scale(0.8) translateX(-6px);
    transform: scale(0.8) translateX(-6px); }
  100% { -webkit-transform: scale(1);
    transform: scale(1); } }

.lum-lightbox { background: rgba(0, 0, 0, 0.6); }

.lum-lightbox-inner { top: 2.5%; right: 2.5%; bottom: 2.5%; left: 2.5%; }

.lum-lightbox-inner img { position: relative; }

.lum-lightbox-inner .lum-lightbox-caption { max-width: 700px; margin: 0 auto; text-align: center; color: #fff; }

.lum-loading .lum-lightbox-loader { position: absolute; top: 50%; left: 50%; display: block; width: 66px; height: 20px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: lum-loader-rotate 1800ms infinite linear; animation: lum-loader-rotate 1800ms infinite linear; }

.lum-lightbox-loader:before, .lum-lightbox-loader:after { position: absolute; top: 50%; display: block; width: 20px; height: 20px; margin-top: -10px; content: ''; border-radius: 20px; background: rgba(255, 255, 255, 0.9); }

.lum-lightbox-loader:before { left: 0; -webkit-animation: lum-loader-before 1800ms infinite linear; animation: lum-loader-before 1800ms infinite linear; }

.lum-lightbox-loader:after { right: 0; -webkit-animation: lum-loader-after 1800ms infinite linear; animation: lum-loader-after 1800ms infinite linear; -webkit-animation-delay: -900ms; animation-delay: -900ms; }

.lum-lightbox.lum-opening { -webkit-animation: lum-fade 180ms ease-out; animation: lum-fade 180ms ease-out; }

.lum-lightbox.lum-opening .lum-lightbox-inner { -webkit-animation: lum-fadeZoom 180ms ease-out; animation: lum-fadeZoom 180ms ease-out; }

.lum-lightbox.lum-closing { -webkit-animation: lum-fade 300ms ease-in; animation: lum-fade 300ms ease-in; animation-direction: reverse; }

.lum-lightbox.lum-closing .lum-lightbox-inner { -webkit-animation: lum-fadeZoom 300ms ease-in; animation: lum-fadeZoom 300ms ease-in; animation-direction: reverse; }

.lum-img { transition: opacity 120ms ease-out; }

.lum-loading .lum-img { opacity: 0; }

.lum-gallery-button { position: absolute; top: 50%; overflow: hidden; width: 60px; height: 100px; max-height: 100%; margin: 0; padding: 0; cursor: pointer; -webkit-transform: translateY(-50%); transform: translateY(-50%); white-space: nowrap; text-indent: 150%; border: 0; outline: 0; background: transparent; }

.lum-previous-button { left: 12px; }

.lum-next-button { right: 12px; }

.lum-gallery-button:after { position: absolute; top: 50%; display: block; width: 36px; height: 36px; content: ''; border-top: 4px solid rgba(255, 255, 255, 0.8); }

.lum-previous-button:after { left: 12%; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); border-left: 4px solid rgba(255, 255, 255, 0.8); border-radius: 3px 0 0 0; box-shadow: -2px 0 rgba(0, 0, 0, 0.2); }

.lum-next-button:after { right: 12%; -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); border-right: 4px solid rgba(255, 255, 255, 0.8); border-radius: 0 3px 0 0; box-shadow: 2px 0 rgba(0, 0, 0, 0.2); }

/* This media query makes screens less than 460px wide display in a "fullscreen"-esque mode. Users can then scroll around inside the lightbox to see the entire image. */
.lum-lightbox { z-index: 1000; }

.lum-lightbox-image-wrapper { position: relative; }

.lum-lightbox-position-helper { position: absolute; top: 50%; left: 0; display: block; width: 100%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }

@media screen and (min-width: 769px) { .slick-slider .slick-prev { position: relative; padding-left: 61px; }
  .slick-slider .slick-prev:before { position: absolute; top: calc(50% - 30.8px +  8px); left: calc(8px + 20px); width: 40px; height: 40px; margin: auto; content: ''; -webkit-transform: rotate(45deg); transform: rotate(45deg); vertical-align: middle; border-top: 4px solid #fff; border-right: 4px solid #fff; }
  .slick-slider .slick-next { position: relative; padding-right: 61px; }
  .slick-slider .slick-next:before { position: absolute; top: calc(50% - 30.8px +  8px); right: calc(8px + 20px); width: 40px; height: 40px; margin: auto; content: ''; -webkit-transform: rotate(45deg); transform: rotate(45deg); vertical-align: middle; border-top: 4px solid #fff; border-right: 4px solid #fff; } }

@media screen and (max-width: 768px) { .sp_view { display: block; }
  .pc_view { display: none; }
  .sp_item { display: initial; }
  .pc_item { display: none; }
  .mb10 { margin-bottom: 2vw; }
  .mb20 { margin-bottom: 4vw; }
  .mb30 { margin-bottom: 6vw; }
  .mb40 { margin-bottom: 8vw; }
  .mb60 { margin-bottom: 10vw; }
  .mb80 { margin-bottom: 12vw; }
  .mb100 { margin-bottom: 14vw; }
  .mt10 { margin-top: 2vw; }
  .mt20 { margin-top: 4vw; }
  .mt30 { margin-top: 6vw; }
  .mt40 { margin-top: 8vw; }
  .mt60 { margin-bottom: 10vw; }
  .mt80 { margin-bottom: 12vw; }
  .mt100 { margin-bottom: 14vw; }
  body { font-size: 3.8vw; }
  .site_width { width: 88%; }
  .sec_ttl { font-size: 6.4vw; }
  .sub_ttl { font-size: 4vw; margin-bottom: 4vw; }
  #header { position: fixed; z-index: 9; top: 0; left: 0; width: 100%; padding: 2vw 0; }
  #header .header_inner { display: block; }
  #header .logo { float: left; width: 35%; margin-right: 8.2vw; }
  #gnav { display: none; }
  #footer { padding: 10vw 0; }
  #footer .inner { display: block; padding-bottom: 4vw; text-align: center; }
  #footer .inner .footer_logo { width: 35%; margin-right: 0; }
  #footer .inner .footer_nav { display: none; }
  #footer .inner .footer_nav .corporate_link { display: none; }
  #footer .copyright { font-size: 2.7vw; text-align: center; }
  .sec1, .sec2, .sec3, .sec4 { padding: 10vw 0; }
  .over_img { position: relative; }
  .sec2 .sec_ttl { position: relative; z-index: 1; padding-left: 0; }
  .sec2 .sec_ttl span { font-size: 3.8vw; }
  .sec2 .band_ttl { font-size: 5vw; position: relative; z-index: 1; left: -7%; width: calc(100% + 14%); margin: 10vw 0 0; padding: 2vw 0; text-align: center; }
  .sec2 .over_img { position: absolute; z-index: 0; top: 0; left: calc((100% - 71%)/2); display: none; width: 71%; }
  .sec2 .sec2_list { margin-top: 6vw; }
  .sec2 .sec2_list li { display: block; margin-bottom: 0; padding: 0; border-bottom: none; }
  .sec2 .sec2_list li .number_wrap { width: 100%; margin-right: 0; margin-bottom: 6vw; padding-bottom: 6vw; border-bottom: 1px solid #e5e5e5; }
  .sec2 .sec2_list li .ttl { height: auto; margin-bottom: 4vw; }
  .sec2 .sec2_list li .ttl .number { font-size: 6vw; line-height: 1; width: 16vw; height: 12vw; margin-right: 2vw; padding-left: 3px; }
  .sec2 .sec2_list li .ttl .text { font-size: 5vw; width: 76vw; }
  .sec2 .sec2_list li p { height: auto; }
  .sec_option { padding: 6vw 0; }
  .sec_option .option_wrap { display: block; width: 96%; }
  .sec_option .left { width: 100%; margin-right: 0; }
  .sec_option .left .option_ttl { font-size: 8vw; margin-bottom: 8vw; justify-content: center; }
  .sec_option .left .option_ttl .small { font-size: 4.2vw; margin-left: 2vw; }
  .sec_option .right { width: 100%; }
  .sec_option .right h3 { font-size: 2.8vw; }
  .sec_option .right p { font-size: 2.6vw; text-align: justify; }
  .sec_option .right .top_cont { width: 98%; margin-bottom: 11vw; }
  .sec_option .right .top_cont img { right: -2vw; bottom: -8vw; width: 32%; }
  .sec_option .right .top_cont p { margin-bottom: 3vw; padding-right: 34vw; padding-bottom: 3vw; }
  .sec_option .right .top_cont span { font-size: 2.6vw; padding-right: 29vw; }
  .sec_option .right .option_inner { width: 48%; }
  .sec_option .right .option_inner img { margin-right: 2vw; }
  .sec_option .right .option_inner:nth-of-type(2) { margin-right: 2vw; margin-left: 0; padding-right: 2vw; }
  .sec_option .right .option_inner:nth-of-type(2):before { top: 0; height: 100%; }
  .sec_option .right .option_inner:nth-of-type(2) img { width: 66px; height: 67px; margin-top: 0; }
  .sec_option .right .option_inner:nth-of-type(3) img { width: 65px; height: 59px; }
  .sec3 .top_cont .sec_ttl { margin-bottom: 6vw; padding-top: 66vw; padding-left: 0; }
  .sec3 .top_cont .band_ttl { display: block; margin: 10vw 0 0; padding: 2vw 6vw; text-align: center; }
  .sec3 .top_cont .band_ttl span { display: block; text-align: justify; }
  .sec3 .top_cont .band_ttl span:nth-of-type(1) { font-size: 4.2vw; }
  .sec3 .top_cont .band_ttl span:nth-of-type(2) { font-size: 5vw; display: flex; margin-top: 1vw; align-items: center; justify-content: center; }
  .sec3 .top_cont .band_ttl .sec3_arrow { width: 4.4vw; height: 4vw; margin: 0 2vw 0 -2vw; }
  .sec3 .top_cont .note { font-size: 3.8vw; margin-top: 2vw; padding-left: 0; }
  .sec3 .top_cont .note .pc_view { display: none; }
  .sec3 .top_cont .over_img { position: absolute; top: 0; left: calc((100% - 71%)/2); width: 71%; }
  .sec3 .sec3_list { display: block; margin-top: 10vw; }
  .sec3 .sec3_list li { width: 100%; height: 100%; margin-right: 0; margin-bottom: 4vw; }
  .sec3 .sec3_list li:last-child { margin-bottom: 0; }
  .banner_area { display: block; padding: 10vw 0; }
  .banner_area .text_area { width: 88%; margin: auto; }
  .banner_area .text_area h2 { font-size: 4.8vw; padding-bottom: 3vw; }
  .banner_area .text_area p { margin: 3vw 0 6vw; }
  .banner_area .triangle { display: none; }
  .banner_area .img_area { width: 88%; margin: auto; }
  .sec4 .sec_ttl { font-size: 8vw; text-align: center; }
  .sec4 .sec_ttl span { font-size: 4.2vw; margin-left: 1vw; }
  .sec4 .howto_list li { display: block; padding: 0; border-bottom: none; }
  .sec4 .howto_list li .howto_wrap { width: 100%; margin-left: 0; padding: 4vw 0; border-bottom: 1px solid #e5e5e5; align-items: flex-start; }
  .sec4 .howto_list li .howto_wrap .number { font-size: 5vw; top: 0; width: 8vw; height: 8vw; }
  .sec4 .howto_list li .howto_wrap img { width: 27%; height: auto; margin-right: 4vw; }
  .sec4 .howto_list li .howto_wrap .right { width: 57%; }
  .sec4 .howto_list li .howto_wrap .right .ttl { font-size: 5vw; text-align: justify; }
  .sec4 .howto_list li .howto_wrap .right p { width: 100%; }
  .slick-slider .slick-prev { position: relative; padding-left: 33px; }
  .slick-slider .slick-prev:before { position: absolute; top: calc(50% - 16.8px +  8px); left: calc(8px + 10px); width: 20px; height: 20px; margin: auto; content: ''; -webkit-transform: rotate(45deg); transform: rotate(45deg); vertical-align: middle; border-top: 4px solid #fff; border-right: 4px solid #fff; }
  .slick-slider .slick-next { position: relative; padding-right: 33px; }
  .slick-slider .slick-next:before { position: absolute; top: calc(50% - 16.8px +  8px); right: calc(8px + 10px); width: 20px; height: 20px; margin: auto; content: ''; -webkit-transform: rotate(45deg); transform: rotate(45deg); vertical-align: middle; border-top: 4px solid #fff; border-right: 4px solid #fff; }
  .slick-slider .slick-dots { top: 1vw; }
  .slick-slider .slick-dots li button { width: 10px; height: 10px; } }

@media (max-width: 460px) { .lum-lightbox-image-wrapper { display: block; overflow: auto; -webkit-overflow-scrolling: touch; }
  .lum-lightbox-caption { position: absolute; bottom: 0; width: 100%; }
  .lum-lightbox-inner img { display: block; max-width: none; max-height: none; }
  .lum-lightbox-inner img { max-width: 200vw; }
  .lum-gallery-button:after { width: 6vw; height: 6vw; } }
