@import url("https://fonts.googleapis.com/css?family=Montserrat:400,600,700,800,900");

:root {
  --navy: #015486;
  --dnavy: #004269;
  --bnavy: #036794;
  --blue: #0BA8C4;
  --lblue: #E9F3FC;
  --yellow: #FFE102;
  --lyellow: #F7F6DD;
  --gray: #555555;
  --bg_gray: #E6E6E6;
  --black: #000;
}

.white { color: #fff !important }
.navy { color: var(--navy) !important }
.center { text-align: center }
.left { text-align: left }
.right { text-align: right }

html { scroll-behavior: smooth; scroll-padding-top: 120px }
body { font-family: "Inter", sans-serif; color:var(--gray) }
/*body { font-family: "Montserrat", "Inter", sans-serif }*/
main { padding-top: 100px }

/*** 共通設定 ***/
a { transition: 0.2s }
p.txt { line-height:1.8em; margin-bottom:20px; font-size:15px }
.err { display:none }
.no-wrap { white-space: nowrap; display: inline-block }
.op:hover { opacity: 0.7 }

.pc-only { display: block !important }
.sp-only { display: none !important }
span.pc-only { display: inline !important }

.fw-normal { font-weight: normal }
.fw-500 { font-weight: 500 }
.fw-600 { font-weight: 600 }
.fw-bold { font-weight: bold }
.font_en { font-family: 'Montserrat', 'Inter', sans-serif }

.d-flex { display: flex }
.d-flex-jc { justify-content: space-between }

.mt5 { margin-top: 5px !important }
.mt10 { margin-top: 10px !important }
.mt15 { margin-top: 15px !important }
.mt20 { margin-top: 20px !important }
.mt30 { margin-top: 30px !important }
.mt40 { margin-top: 40px !important }
.mt50 { margin-top: 50px !important }
.mt60 { margin-top: 60px !important }
.mt70 { margin-top: 70px !important }
.mt80 { margin-top: 80px !important }
.mt90 { margin-top: 90px !important }
.mt100 { margin-top: 100px !important }
.mt120 { margin-top: 120px !important }
.mt140 { margin-top: 140px !important }
.mt160 { margin-top: 160px !important }
.mt180 { margin-top: 180px !important }
.mt200 { margin-top: 200px !important }
.mt300 { margin-top: 300px !important }
.mt350 { margin-top: 350px !important }
.mt400 { margin-top: 400px !important }

.mb5 { margin-bottom: 5px !important }
.mb10 { margin-bottom: 10px !important }
.mb15 { margin-bottom: 15px !important }
.mb20 { margin-bottom: 20px !important }
.mb30 { margin-bottom: 30px !important }
.mb40 { margin-bottom: 40px !important }
.mb50 { margin-bottom: 50px !important }
.mb60 { margin-bottom: 60px !important }
.mb70 { margin-bottom: 70px !important }
.mb80 { margin-bottom: 80px !important }
.mb90 { margin-bottom: 90px !important }
.mb100 { margin-bottom: 100px !important }
.mb110 { margin-bottom: 110px !important }
.mb120 { margin-bottom: 120px !important }
.mb130 { margin-bottom: 130px !important }
.mb140 { margin-bottom: 140px !important }
.mb150 { margin-bottom: 150px !important }

.txt_under { padding-bottom: 5px; background-image: linear-gradient(var(--navy), var(--navy)); background-repeat: no-repeat; background-position: bottom right; background-size: 0 2px; transition: background-size 0.2s }
.txt_under.current { background-position: bottom left; background-size: 100% 2px }
.txt_under:hover { background-position: bottom left; background-size: 100% 2px }
a:hover span.txt_under { background-position: bottom left; background-size: 100% 2px }
.txt_under.under_white { background-image: linear-gradient(white, white); background-size: 0 1.5px }
.txt_under.under_white:hover {background-size: 100% 1.5px }

.yellow { background:linear-gradient(transparent 50%, rgba(255,225,2,0.6) 50%) }

.btn_link { float:right; color:var(--navy); letter-spacing: 0.1em; font-weight:600; position:relative; margin-right: 30px }
.btn_link span {font-size:30px; font-weight:normal; position:absolute; top:-11px; right: -30px; display:inline-block }
/* ボタン矢印動き */
.fa.fa-angle-right{ animation:scrollright3 2s ease infinite }
.fa.fa-angle-left{ animation:scrollrleft3 2s ease infinite }
@keyframes scrollright3{
  0%{ transform:translateX(-15px);  opacity:0}
 45%{ transform:translateX(0px);  opacity:1}
 65%{ transform:translateX(-5px);  opacity:1}
 100%{ transform:translateX(15px);  opacity:0}
}
@keyframes scrollrleft3{
  0%{ transform:translateX(15px);  opacity:0}
 45%{ transform:translateX(0px);  opacity:1}
 65%{ transform:translateX(5px);  opacity:1}
 100%{ transform:translateX(-15px);  opacity:0}
}
.container::after{ content:""; display: block; width:320px }
.container4::before{content:"";display: block;width:255px;order:1}
.container4::after{content:"";display: block;width:255px}

.con_1160 { width: 1160px; margin: 0 auto; padding: 0 40px }
.con_1080 { width: 1080px; margin: 0 auto; padding: 0 0 }
.con_800 { width: 800px; margin: 0 auto; padding: 0 0 }
.con_right { padding: 100px 0 0 calc((100vw - 1080px) / 2) }
.con_right .hd_ttl_en span { color: var(--blue) }
.bg_yellow  { background-color:rgba(247, 246, 221, 0.3) }

.hd_ttl_en p { font-family: "Montserrat"; font-size:80px; background: linear-gradient(90deg, var(--blue) 0%, var(--navy) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight:bold; display: inline-block }
.hd_ttl_en hr { border:none; height: 3px; background: linear-gradient(to right, var(--blue), var(--navy) ) }
.hd_ttl_en span { font-weight:bold; margin-top:20px; color: var(--navy); font-size:20px; display:block }
.hd_ttl_en + p { line-height:1.6em }
.hd_catch30 { font-size:30px; font-weight:bold; line-height:1.4em }
.hd_catch26 { font-size:26px; font-weight:bold; line-height:1.4em; color:var(--navy) }
.hd_catch24 { font-size:24px; font-weight:bold; line-height:1.4em; color:var(--navy) }
.hd_catch19 { font-size:19px; font-weight:bold; line-height:1.6em; color:var(--navy) }
.hd_bar { font-size:18px; position:relative; color:var(--navy); font-weight:bold; padding-left:20px }
.hd_bar:before {content:"";position:absolute;left:0;top:-1px;background:var(--navy);width:4px;height:20px}
.cld_header .hd_ttl_en p { text-shadow: 2px 2px 3px rgba(1, 84, 134, 0.2) }

.view-more-button{position:relative; margin:20px auto 100px; display:block; color:var(--navy); font-size:18px; width:140px}
.view-more-button span{ content:"";  display:inline-block;  vertical-align:middle;  color:var(--navy);  line-height:1;  width:1em;  height:1em;  border:.2em solid currentColor;  border-left:0;  border-bottom:0;  box-sizing:border-box;  transform:translateY(25%) rotate(135deg);  position:absolute;  top:20px;  left:61.27px;  transition:.3s}
.view-more-button:hover span{ top:25px}
.page-load-status{margin:20px auto 100px}


/*** ヘッダ ***/
header section { display: flex; justify-content: space-between; align-items: center; align-items: flex-start; padding: 20px 40px 0px; position:fixed; width:100%; z-index:2; background-color: rgba(255, 255, 255, 0.8); height: 80px }
.header_logo { z-index: 3 }
.header_logo a p { position:relative; white-space: nowrap; margin-left: 55px }
.header_logo a p::before{ content:""; background-image: url(../img/cmn/logo_mark.svg); width: 40px; height: 40px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -55px; top: 0 }
.header_logo a p span { position: absolute; top: 28px; left: 0; font-size: 12px; font-weight: bold; letter-spacing: 0.04em }
.header_logo a:hover { opacity: 1 }
.nav_menu_ul { font-size: 16px; margin-top: 10px }
.nav_menu_ul li + li { margin-left: 30px }
nav { z-index:1 }
nav .btn_blue { margin-left: 20px; margin-top: -10px; padding: 20px 25px 20px 70px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25) }
.btn_blue { background: linear-gradient(180deg, var(--blue) 0%, var(--navy) 50%, var(--blue) 100%); background-size: 100% 200%; display: block }
.btn_blue:hover { background-position: 0% 100% }
.btn_blue p { font-size: 20px; text-align: center; letter-spacing:0.03em; position: relative; line-height:unset }
.btn_blue span { font-size:14px; display: block; margin-top: 2px }
nav .btn_blue p::before{ content:""; background-image: url(../img/cmn/icon_phone.svg); width: 40px; height: 40px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -45px; top: 0 }
li.gnavi__list{ position:relative}
.dropdown__lists{ visibility:hidden;  opacity:0;  transition:all .3s;  width:220px;  position:absolute;  top:30px;  left:-20px}
.gnavi__list:hover .dropdown__lists{ visibility:visible;  opacity:1}
.dropdown__list:first-child{padding-top:10px}
.dropdown__list:last-child{padding-bottom:10px}
.dropdown__list{ background-color:rgba(255,255,255,0.90);   transition:all .3s;  position:relative;  margin-left:0px !important}
.dropdown__list a{  justify-content:center;  align-items:center;  color:var(--navy);  text-decoration:none;  position:relative;  padding:15px 0 15px 35px;  text-align:left;  display:block}
.dropdown__list a::before{ content:'-';  display:block;  position:absolute;  left:20px;  top:14px}
/*@media screen and (min-width: 850px){
  a[href*="tel:"] { pointer-events: none; cursor: default; text-decoration: none }
}*/


/*** ファーストビュー ***/
.top_fv { position:relative; z-index:0; margin-top: -20px; max-height:800px }
.top_slider { width:95%; max-height:800px }
.top_slider img { width:100% }
/*.top_slider img { height:100% }*/
.top_catch { position:absolute; background-color: rgba(0, 0, 0, 0.3); padding:50px 60px 100px 140px; right: 2%; bottom: -40px; width: 960px; line-height:3.8em; letter-spacing: 0.05em }
.top_catch .p1 { font-size:28px }
.top_catch .p2 { font-size:42px }
.top_catch .p2 .big { font-size:55px }
.top_catch .p2 .big_x { font-size:70px; margin-right: 5px }
.top_catch .p3 { font-size:42px }
.top_catch p { margin-bottom:0px } 
.top_fv .slick-dots { bottom: -30px; padding-left:20px; text-align: left }
.top_fv .slick-dots li button:before { font-size:10px }
.top_slider .slick-dots li.slick-active button:before { color:var(--navy) !important }
.top_slider .slick-dots li button:before { color:var(--navy) !important }
.top_slider .slick-list { max-height:800px }


/*** ミッション ***/
.con_mission { margin-top: 240px; margin-right:calc((100vw - 1080px) / 2); background-color: rgba(214, 230, 243, 0.5); position:relative; padding: 0 110px 110px 0; z-index: -3 }
.con_mission .bg_white { background-color: rgba(255, 255, 255, 0.77); padding: 60px 60px 60px 0 }
.con_mission .bg_white p { margin-left: calc((100vw - 1080px) / 2) }
.con_mission .bg_white h2 p { margin-left: calc((100vw - 1080px) / 2 + 48px); position:relative }
.con_mission .bg_white h2 p:before { content:""; background: url(../img/cmn/logo_mark.svg) no-repeat center / contain; width: 35px; height: 35px; position: absolute; left: -48px; top: 18px }
.con_mission .bg_mission { background: url(../img/top/bg_mission.jpg) no-repeat center / contain; position:absolute; right: calc((100% - 1080px) * -1); top:-60px; width:700px; height:466px; opacity:1; z-index:-1 }
.con_mission .hd_ttl_en { display:inline-block }


/*** お悩み ***/
.con_problem { margin-top: 120px; position:relative }
.con_problem > div { flex-direction: row; justify-content:flex-start }
.con_problem img { margin-right: -30px; width: 433px }
.problem_ttl { font-size:26px; margin-bottom:30px }
.problem_dtl { font-size:17px; margin-left:16px }
.problem_dtl p { transform: skewX(-160deg); background-color:var(--bg_gray); padding:26px 0 25px 80px; margin-bottom:20px; width:420px }
.problem_dtl:last-child p { width:480px }
.problem_dtl p span { display: block; transform: skewX(160deg); position:relative }
.problem_dtl p + p { margin-left:33px }
.problem_dtl p + p + p { margin-left:66px; margin-bottom:0px }
.problem_dtl p span::before{ content:""; background-image: url(../img/cmn/icon_check.svg); width: 29px; height: 18px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -38px; top: 0px }
.problem_dtl:last-child { margin-left:-30px }
.arrow_three { width:345px; height:106px; margin-top:40px }
.con_problem::after { content:""; background: url(../img/top/problem_man.svg) no-repeat center / contain; width: 170px; height: 245px; position: absolute; right: 30px; bottom: -51px; transform: scale(-1, 1) }


/*** サービス ***/
.con_consul { padding-bottom:100px; border-bottom: 1.5px solid #fff }
.con_service { position:relative; z-index: 1; margin-top: 50px; overflow: hidden }
.con_service .hd_ttl_en { position: absolute; left: calc((100vw - 1080px) / 2 - 27px); top:150px; z-index: 1 }
.con_service .hd_ttl_en::before { content:""; background: url('../img/cmn/ttl_service.png') no-repeat center / contain; width:110px; height:629.5px; display: block }
.con_service .service { position:relative; background-color: var(--dnavy); margin-left: calc((100vw - 1080px) / 2 + 60px); ; padding: 100px calc((100vw - 1080px)/2) 220px 100px; z-index: -2 }
.con_service .service::before { content:""; background: url('../img/top/img_analytics.png') no-repeat center / contain; width: 1200px; opacity: 0.4; position: absolute; left: -240px; bottom: 0; width:1488px; height:1010px; z-index: -1 }
.con_consul .consul { background-color: rgba(11, 168, 196, 0.6); position: relative; margin-top: 115px; height:120px; z-index: 0; width: 920px }
.con_service .service_ttl a { position:relative }
.con_service .service_ttl a::after{content:''; width:12px; height:12px; margin-top:-5px; border-top:solid 3px #fff; border-right:solid 3px #fff; transform:rotate(45deg); position:absolute; top:50%; right:-25px; transition: all 0.2s ease}
.con_service .service_ttl a:hover::after { right:-30px }
.con_service .service_ttl { position:relative; font-size: 22px; font-weight: bold; position: absolute; top: -12px; left: 60px }
.con_service .service_ttl::before { font-size: 60px; font-weight: bold; opacity: 0.2; position: absolute; left: -39px; top: -22px; z-index: -1 }
.con_service .service_ttl.ttl1::before { content:"REVENUE" }
.con_service .service_ttl.ttl2::before { content:"PROFIT" }
.con_service .service_ttl.ttl3::before { content:"ORGANIZATION" }
.con_service .service_ttl + p { font-size: 22px; position: absolute; top: -12px; right: 187px; font-weight: 500 }
.con_service .service_ttl + p span { font-size: 100px; color: transparent; -webkit-text-stroke: 2px white; font-weight:bold; position: absolute; top: -65px; right: -136px; letter-spacing: 0.02em }
.con_service .service_ttl.ttl1 + p span { right: -120px }
.con_service .service_ul { position: absolute; top: 45px; left: 55px; width:810px }
.con_service .service_ul li { background-color:rgba(255, 255, 255, 0.9); text-align:center; color:var(--navy); width:260px; font-size: 17px; font-weight: bold; text-align: left; padding: 0 0 0 50px; display: flex; flex-direction: column; justify-content: center; height: 100px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5) }
.con_service .service_ul li p + p { margin-top:12px }
.con_service .service_dtl { position:relative; line-height: 1.2em }
.con_service .service_dtl::before { content:"-"; font-size: 20px; font-weight: bold; position: absolute; left: -15px; top: 50%; transform: translateY(-50%) translateX(-50%) }
.con_service2 .service_dtl::after { content:''; width:10px; height:10px; margin-top:-5px; border-top:solid 2px var(--navy); border-right:solid 2px var(--navy); transform:rotate(45deg); position:absolute; top:50%; right:55px; transition: all 0.1s ease }
.con_service2 h3:hover .service_dtl::after { right:50px }
.con_service2 .s_system .service_dtl::after { right:40px }
.con_service2 .s_system h3:hover .service_dtl::after { right:35px }
.con_service2 { padding-right:30px }
.con_service2 li { background-color: rgba(11, 168, 196, 0.6); position: relative; margin-top: 90px; height:80px; width: 255px; height: 100px }
.con_service2 h3 { background-color:rgba(255, 255, 255, 0.9); text-align:center; color:var(--navy); width:255px; font-size: 17px; font-weight: bold; text-align: left; padding: 0 0 0 75px; height: 90px; position:absolute; left: 30px; top: 35px; display: flex; flex-direction: column; justify-content: center; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5) }
.con_service2 .s_system h3 { padding: 0 0 0 60px }
.con_service2 .service_ttl { font-size: 30px; font-weight: 600; left: 30px; letter-spacing: 0.03em }
.btn_blue_st p::after{content:''; width:8px; height:8px; margin-top:-5px; border-top:solid 2px #fff; border-right:solid 2px #fff; transform:rotate(45deg); position:absolute; top:50%; right:-20px}


/*** 支援事例 ***/
.con_case { margin-top: -60px; margin-right:calc((100vw - 1080px)/2 - 80px); background-color: rgba(214, 230, 243, 0.5); position:relative; padding: 160px 120px 100px 0; z-index: 0; overflow:hidden }
.con_case .hd_ttl_en { display:block; text-align:right }
.con_case .hd_ttl_en p { margin-left: calc((100vw - 1080px) / 2) }
.top .case_list.con_1160 { float:right; padding:0px; width: 100% }
.case_slider { width:990px; float:right; padding: 0; margin-right:-10px }
.case_list li.case_li { width:320px; background-color:#fff; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25); padding: 20px 0px 20px; margin:20px 10px 10px 0 }
.case_list li.case_li:hover img { transform: scale(1.1) }
.case_box { position:relative }
.case_box .hotel_type .hotel_cat, .case_box .hotel_type .hotel_scale { background:var(--navy); padding:6px 12px; color:#fff; white-space: nowrap; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25) }
.case_box .hotel_type { position:absolute;top:-55px; font-size: 17px; font-weight:600 }
.top .case_box .hotel_type { left:50%;transform: translateX(-50%);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%) }
.case_box .hotel_type .hotel_cat { margin-right:4px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25) }
.case_ttl { font-size: 24px;font-weight:600; margin:20px 20px 20px }
.app_service ul { margin:20px 20px 0; flex-wrap: wrap }
.app_service ul li { border: 2px solid var(--navy); border-radius:20px; padding: 5px 10px; font-size:16px; font-weight:bold; margin:0 5px 5px 0 }
.case_img img { width:100%; height:auto; transition: transform .3s ease }
.case_img { width:320px; height:213px; overflow:hidden }
.case_list .slick-prev { left: -50px; transition:all .2s ease }
.case_list .slick-next { right: -25px; transition:all .2s ease }
.case_list .slick-prev:before { background: url('../img/cmn/sl_arrow_l.svg') no-repeat center / contain }
.case_list .slick-next:before { background: url('../img/cmn/sl_arrow_r.svg') no-repeat center / contain }
.case_list .slick-prev:before, .case_list .slick-next:before { opacity:1; font-size:36px; font-family: unset; line-height: unset; color: unset; }
.case_list .slick-prev:hover { left:-55px }
.case_list .slick-next:hover { right:-30px }


/*** お客様の声 ***/
.con_voice ul { margin-top:60px; display: flex; flex-direction: column; align-items: flex-start }
.con_voice ul li { box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.25); padding:20px 25px; font-weight:bold; margin-bottom:15px; font-size:18px; display:inline-block; position:relative }
.con_voice ul li::after { content:"";  position: absolute }
.con_voice ul li:nth-child(1)::after{ background: url(../img/top/voice_3.svg) no-repeat center / contain; width: 153px; height: 147px; right: -220px; bottom: 10px }
.con_voice ul li:nth-child(3)::after{ background: url(../img/top/voice_1.svg) no-repeat center / contain; width: 182px; height: 153px; right: -230px; bottom: -45px }
.con_voice ul li:nth-child(5)::after{ background: url(../img/top/voice_2.svg) no-repeat center / contain; width: 163px; height: 144px; right: -460px; bottom: -100px }

/*** 支援の流れ ***/
.con_flow { margin-left:calc((100vw - 1080px)/2 - 80px); background-color: rgba(214, 230, 243, 0.5); position:relative; padding: 100px calc((100vw - 1080px)/2) 100px 80px }
.con_flow .hd_ttl_en { display:block; text-align:right }
.con_flow .hd_ttl_en hr { margin-left: calc((100vw - 1080px)/2*-1) }
.con_flow ul li{ position: relative; padding: 42px 0 0 0; margin-right: 62.8px; background-color: #fff; height: 200px; width: 80px; font-weight: bold; height:330px; font-size:18px; color:var(--navy); letter-spacing:0.2em }
.con_flow ul li span { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-orientation: upright; display: flex; align-items: center; width: 80px }
.con_flow ul li::after { content: ""; position: absolute; top: 50%; right: -150px; transform: translateY(-50%);   border: 100px solid transparent }
.con_flow ul li::after { border-left: 35px solid #555 }
.con_flow ul li:nth-child(1)::after { border-left-color: var(--blue) }
.con_flow ul li:nth-child(2)::after { border-left-color: #0A9BBB }
.con_flow ul li:nth-child(3)::after { border-left-color: #088DB0 }
.con_flow ul li:nth-child(4)::after { border-left-color: #067FA6 }
.con_flow ul li:nth-child(5)::after { border-left-color: #04709B }
.con_flow ul li:nth-child(6)::after { border-left-color: #036190 }
.con_flow ul li:nth-child(7)::after { border-left-color: #025B8B }
.con_flow ul li:last-child::after { display:none }
.con_flow ul li::before { font-size: 50px; position: absolute; top: -30px; left:50%;transform: translateX(-50%);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%); text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25) }
.con_flow ul li:nth-child(1)::before { content:"01"; color: var(--blue) }
.con_flow ul li:nth-child(2)::before { content:"02"; color: #0A9BBB }
.con_flow ul li:nth-child(3)::before { content:"03"; color: #088DB0 }
.con_flow ul li:nth-child(4)::before { content:"04"; color: #067FA6 }
.con_flow ul li:nth-child(5)::before { content:"05"; color: #04709B }
.con_flow ul li:nth-child(6)::before { content:"06"; color: #036190 }
.con_flow ul li:nth-child(7)::before { content:"07"; color: #025B8B }
.con_flow ul li:nth-child(8)::before { content:"08"; color: vat(--navy) }


/*** コラム ***/
.column_list { width:255px }
.con_column .con_1080 { margin-left:0px; padding:0 }
.img_column { display: block; width:255px; height:255px; overflow:hidden }
.img_column img { width:100%; height:auto; transition: transform .3s ease }
.txt_column .date { font-size:15px; display:block }
.txt_column .ttl { font-size:16px; display:block }
.txt_column .cat { flex-wrap: wrap }
.txt_column .cat li { border:2px solid var(--navy); padding:5px 10px; font-size:14px; border-radius: 20px; margin:0 5px 5px 0; transition: all 0.3s ease }
.txt_column .cat li:hover { border:2px solid var(--navy); color: #fff; background-color: var(--navy) }
.img_column img:hover { transform: scale(1.1) }
.no_thum { background-color: rgba(214, 230, 243, 0.5); width:100%; height:100%; justify-content: center; align-items: center }
.no_thum img { width:120px; height:120px }


/*** 下層ページ 共通 ***/
.cld_header { margin-top: -20px; margin-right: calc((100vw - 1080px) / 2); height:300px; padding:120px 80px 0 0 }
.pg_service .cld_header { background: url('../img/child/bg_head_service.png?20251001') no-repeat center / cover }
.pg_case_lst .cld_header { background: url('../img/child/bg_head_case.png?20251001') no-repeat center / cover }
.pg_case_dtl .cld_header { background: url('../img/child/bg_head_case.png?20251001') no-repeat center / cover }
.pg_column_lst .cld_header { background: url('../img/child/bg_head_column.png') no-repeat center / cover }
.pg_column_dtl .cld_header { background: url('../img/child/bg_head_column.png') no-repeat center / cover }
.pg_company .cld_header { background: url('../img/child/bg_head_company.png') no-repeat center / cover }
.pg_contact .cld_header { background: url('../img/child/bg_head_contact.png') no-repeat center / cover }
.pg_privacypolicy .cld_header { background: url('../img/child/bg_head_privacypolicy.png') no-repeat center / cover }
.cld_header .hd_ttl_en { text-align: right }
.cld_contents { margin: 100px auto 50px }
.cld_contents .bg_yellow { padding: 60px 60px 40px }
.hd_ttl_cld { text-align:center; font-size:40px; font-weight:bold; color:var(--navy); margin-bottom:80px }
.hd_ttl_cld .font_en { font-size:20px; display: block; font-weight:600; margin-bottom:15px }
.hd_ttl_cld hr { border:none; width: 100px; height: 8px; background: linear-gradient(to right, var(--blue), var(--navy) ); margin: 0 auto;}
.hd_ttl_cld span.hr { margin-top:30px; display:block }
.hd_blue_gra { color: white; position: relative; height: 110px; background: linear-gradient(to right, var(--blue), var(--navy) ); margin-left: calc(((100vw - 1080px)/2 + 70px)*-1); display:inline-block; font-weight:bold; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); margin-bottom:100px; top: 30px; z-index: 1 }
.hd_blue_gra h3 { font-size:28px; position:relative; text-align: right; margin:40px 40px 0 calc((100vw - 1080px)/2 + 490px) }
.hd_blue_gra h3:before { position:absolute; top:-22px; right:15px; opacity:0.3; font-size:72px }


/*** サービスページ ***/
/* .cld_header { margin-top: -20px; background: url('../img/child/bg_head_service.png') no-repeat center / cover; margin-right: calc((100vw - 1080px) / 2); height:300px; padding:120px 80px 0 0  } */
.cld_consul .consul { position:relative; background-color:rgba(214, 230, 243, 0.5); padding: 0 70px 100px; width:1010px; margin-bottom:100px }
.consul.csl_organization { margin-left: 70px }
.csl_revenue:before { content:""; position: absolute; top: -30px; right: -50px; background: url('../img/service/bg_consul1.png') no-repeat center / contain; width:250px; height:223px }
.csl_organization:before { content:""; position: absolute; top: -50px; left: -100px; background: url('../img/service/bg_consul2.png') no-repeat center / contain; width:237px; height:236.5px }
.csl_profit:before { content:""; position: absolute; top: -30px; right: -50px; background: url('../img/service/bg_consul3.png') no-repeat center / contain; width:170px; height:279px }
.hd_blue_gra p span.no { position:relative }
.hd_blue_gra p span.no:before { content:""; position: absolute; top: 32px; left: calc((100vw - 1080px)/2 - 20px) }
.csl_revenue p span.no:before { background: url('../img/service/01.svg') no-repeat center / contain; width:132px; height:101px }
.csl_organization p span.no:before { background: url('../img/service/02.svg') no-repeat center / contain; width:156px; height:101px; left: 40px }
.csl_profit p span.no:before { background: url('../img/service/03.svg') no-repeat center / contain; width:160px; height:101px }
.hd_blue_gra p span + span { position: absolute; top: 32px; font-size: 18px; opacity: 0.8 }
.csl_revenue p span + span { left: calc((100vw - 1080px)/2 + 115px) }
.csl_organization p span + span { left: 198px }
.csl_profit p span + span { left: calc((100vw - 1080px)/2 + 140px) }
.csl_revenue .hd_blue_gra { min-width: 680px }
.csl_organization .hd_blue_gra { min-width: 940px; float:right; margin-right:calc(((100vw - 1080px)/2 + 80px)*-1) }
.csl_profit .hd_blue_gra { min-width: 680px }
.csl_revenue .hd_blue_gra h3:before { content:"REVENUE" }
.csl_organization .hd_blue_gra h3:before { content:"ORGANIZATION" }
.csl_profit .hd_blue_gra h3:before { content:"PROFIT" }
.cld_contents .service_txt .service_ttl { font-size:24px; font-weight:bold; color:var(--navy); margin-bottom:30px }
.cld_contents .service_box { background-color:#fff; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); padding: 25px 40px 25px 65px; margin-bottom: 15px; margin-right:-140px }
.cld_contents .service_box ul { border-right:2px solid var(--navy); padding-right:30px; font-size:18px; font-weight:bold; color:var(--navy); display: flex; flex-direction: column; justify-content: center }
.csl_organization .service_box { margin-left:-140px; margin-right: 0 }
.cld_contents .service_box li { line-height:1.4em; white-space: nowrap; position:relative }
.cld_contents .service_box li + li { margin-top:13px }
.cld_contents .service_box .txt { padding-left:30px; margin-bottom: 0 }
.cld_contents .service_box li::before { content:"-"; font-size: 20px; font-weight: bold; position: absolute; left: -20px; top: 50%; transform: translateY(-50%) translateX(-50%) }
.csl_revenue .service_box ul { min-width:230px }
.csl_organization .service_box ul { min-width:265px }
.csl_profit .service_box ul { min-width:195px }
.consul .btn_link { margin-right: -98px }
.csl_organization .btn_link { float:left; margin-left: -98px }
.csl_organization .service_txt .service_ttl { padding-top: 218px }


/*** サービスページ コンサル以外***/
.con_cousul2 { background-color:rgba(214, 230, 243, 0.5); margin-right:calc(((100vw - 1080px)/2) * -1); padding:60px calc(((100vw - 1080px) / 2) + 0px) 160px 60px; position:relative; z-index: -2 }
.con_cousul2::before { content:""; position:absolute; width:720px; height:480px; bottom:-50px; right: calc((100vw - 1080px) / 2); z-index: -1 }
#svs_system .con_cousul2::before { background: url(../img/service/bg_service2_1.png) no-repeat center / contain }
#svs_operate .con_cousul2::before { background: url(../img/service/bg_service2_2.png?20251001) no-repeat center / contain }
#svs_cleaning .con_cousul2::before { background: url(../img/service/bg_service2_3.png) no-repeat center / contain }
.con_cousul2 .cousul2_box { background-color:rgba(255, 255, 255, 0.85); padding:45px 45px 40px; font-weight:bold; margin-top:30px; display: inline-block }
.con_cousul2 .cousul2_box h3 { color:var(--navy); font-size: 22px; position: relative; padding-left: 25px; margin-bottom: 25px; display: inline-block; line-height: 1.2em }
.con_cousul2 .cousul2_box h3:before {content:"";position:absolute;left:0;top:3px;background:var(--navy);width:4px;height:20px}
.con_cousul2 .cousul2_box ul { display: flex; flex-direction: column }
.con_cousul2 .cousul2_box ul li { position: relative; padding-left: 20px; line-height:2.3em }
.con_cousul2 .cousul2_box ul li::before { content:"-"; position:absolute; left:0px; top:0px }


/*** 支援事例 ***/
.pg_case_lst .con_case { width: 100%; padding:80px 0 0; margin-right:0px; margin-top:60px }
.pg_case_lst .con_case .case_list { margin-right:0px; margin:0 auto 0 }
.pg_case_lst .con_case .case_list > ul { flex-wrap: wrap; justify-content: space-between; width: 980px; margin: 0 auto }
.pg_case_lst .con_case .case_list > ul > li { margin-bottom:40px }
.pg_case_lst .case_list li.case_li { margin-right:0px }
.pg_case_lst .case_list .container { padding-bottom:60px }
.pg_case_dtl .case_box { position:relative; background-color:rgba(214, 230, 243, 0.5); padding: 0 80px 80px; width:1000px; margin-bottom:100px }
.pg_case_dtl .single .hd_blue_gra { margin-bottom:60px; max-width: calc((100vw - 1080px) / 2 + 1080px); margin-left: calc(((100vw - 1080px) / 2 + 80px) * -1); top: 50px }
.pg_case_dtl .hd_blue_gra h1:before { content:"CASE" }
.eyecatch { position:absolute; width:320px; top:80px; right:-100px }
.pg_case_dtl .bg_white { background-color:#fff; margin-top: -50px; padding: 60px 70px; margin-right: -160px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25) }
.pg_case_dtl .app_ttl { font-size:16px; display:inline-block; font-weight:bold; margin-bottom: 100px }
.pg_case_dtl .app_service { display:inline-block; width:450px }
.case_dtl{ gap:60px }
.case_dtl .case_l { min-width:300px }
.case_dtl .case_l img { width:100% }
.case_dtl .case_r h2 { font-size:18px; font-weight:bold; letter-spacing:0.02em }
.case_dtl .case_r h2 span { font-size:30px; color:var(--navy); letter-spacing: 0.04em }
.pg_case_lst .case_box .hotel_type { top:-55px;left:50%;transform: translateX(-50%);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%) }
.pg_case_dtl .case_box .hotel_type { top:-15px; left:calc((100vw - 1080px) / 2 + 40px) }
.pg_case_lst .view-more-button { margin: 0 auto 140px }
.pg_case_lst .page-load-status { margin: 0 auto 140px }


/*** コラム ***/
.pg_column_lst .column_box > ul { flex-wrap: wrap }
.pg_column_lst .column_box > ul > li { margin-bottom:50px }
.hd_blue_gra h1 { font-size:28px; position:relative; text-align: right; margin:40px 40px 0 calc((100vw - 1080px)/2 + 490px) }
.hd_blue_gra h1:before { position:absolute; top:-22px; right:15px; opacity:0.3; font-size:72px }
.pg_column_lst .hd_blue_gra h1:before { content:"COLUMN" }
.pg_column_dtl .hd_blue_gra h1:before { content:"COLUMN" }
time { display:block; font-size:15px }
.blog-content p { font-size: 15px; line-height:1.8em }
.blog-content p, .blog-content hr, .blog-content img { margin-bottom:30px }
.blog-content a { color: var(--navy); text-decoration:underline; transition:0.3s }
.blog-content a:hover { text-decoration: unset; transition:0.3s }
.blog-content .wp-block-image img { width:100% }
.blog-content :where(.wp-block-columns.is-layout-flex) { gap:4em }
.single .txt_column .cat li { font-size:16px; margin-right:10px }
.pg_column_dtl .single .hd_blue_gra { margin-bottom:60px; margin-left: calc(((100vw - 1080px) / 2 - 0px) * -1); max-width: calc((100vw - 1080px) / 2 + 1080px) }
.single .hd_blue_gra h1 { margin: 40px 40px 0 calc((100vw - 1080px) / 2 + 40px) }
.single .hd_blue_gra h1:before { left: -60px; right:unset }
.single .hd_blue_gra h1 br { display:none }
.pager .pager_prev span { left:-30px; right: unset }
.pager .btn_link { width:350px; margin-right:0px }
.pager .btn_link.pager_next { text-align:right }
.pager { align-items: center; align-items: flex-start }
.pager .txt_under { display: inline-block }
.btn_blue_st { display:inline-block; padding:20px 70px 20px 50px }
.btn_blue_st p { font-size:16px; position:relative }
.btn_blue_st p::after{content:''; width:8px; height:8px; margin-top:-5px; border-top:solid 2px #fff; border-right:solid 2px #fff; transform:rotate(45deg); position:absolute; top:50%; right:-20px; transition: all 0.3s ease }
.btn_blue_st:hover p::after{ right:-25px }
.pager_box { position:relative }
.btn_blue_box { position:absolute;top: 50%;left: 50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-ms-transform: translate(-50%,-50%) }
.pg_column_lst .cld_contents { margin-bottom:0px }
.category_name { font-size:22px; display: flex; align-items: center; justify-content: center }
.category_name span.cat { border:2px solid var(--navy); padding:5px 10px; font-size:14px; border-radius: 20px; margin:0 5px 5px 0 }
.pg_column_cat .btn_blue_box { position: unset; transform: unset; -webkit-transform:unset; -ms-transform:unset; margin-top: 30px }
.pg_column_cat .cld_contents { margin-bottom: 50px }
.blog-content h2 { color: var(--navy); margin-bottom: 10px; font-size: 20px; font-weight: bold }
.blog-content table { width:auto !important }



/*** 会社概要 ***/
.pg_company .bg_white { position:relative }
.pg_company .bg_white::before{ content:""; background-image: url(../img/cmn/logo_mark.svg); width: 340px; height: 340px; background-size: contain; background-repeat: no-repeat; position: absolute; right: -30px; bottom: -120px; opacity:0.1 }
.pg_company .hd_blue_gra h1:before { content:"MESSAGE" }
.signature { font-size:17px }
.table_01 { border: 8px solid var(--lblue); font-size:15px; width: 100% }
.table_01 tr { border: 3px solid var(--lblue) }
.table_01 tr th { background-color: var(--navy); color: #fff; padding: 30px 0 20px; width: 200px; text-align: center; font-weight: 600 }
.table_01 tr td { padding: 30px 25px 30px 25px; line-height: 1.6em }


/*** 問い合わせ ***/
.pg_contact label { color: var(--navy); font-size: 17px; margin-bottom: 8px }
.contact_col { margin-bottom: 40px }
.contact_col span.req { background-color: var(--navy); color: #fff; padding: 4px 8px; font-size: 13px; margin-left: 15px; margin-top: -3px }
.wpcf7-list-item { margin: 0 1em 0 0 !important }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output { text-align: center; border: none; color: #dc3232 }
.wpcf7 form.sent .wpcf7-response-output { color: var(--navy) }
.contact_col .btn_std { font-size: 18px; font-weight: bold }
.btn_blue .wpcf7-spinner { display: none }
.contact_col br { display:none }
.pg_contact .btn_blue { padding:0; transition:all .3s ease }
.pg_contact .btn_blue input { padding: 20px 70px 20px 70px }
.wpcf7-not-valid-tip { margin-top:10px }
.checkbox .wpcf7-not-valid-tip { margin-top:0px }
label { display: flex; font-weight: bold; vertical-align: top }
.contact_col.checkbox { margin-bottom:30px }
.checkbox label { margin-bottom:15px; display:flex; align-items: center }
.checkbox input { box-shadow:none }
.contact_pp { margin-left: 20px }
.contact_pp label { font-size: 15px }
.contact_pp input { box-shadow:none }
input, textarea { padding: 15px 10px; max-width: 100%; box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.25) }
.btn_std input { border: none; line-height: 18.4px }
label + span { display: inline-block; max-width: 78% }
span.wpcf7-list-item-label { padding: 0 0 0 5px }
.wpcf7-list-item { margin-right:20px !important }


/*** プライバシーポリシー ***/
.pg_privacypolicy h3 { font-size:18px; position:relative; color:var(--navy); font-weight:bold; margin:50px 0 15px; padding-left:20px }
.pg_privacypolicy h3:before {content:"";position:absolute;left:0;top:-1px;background:var(--navy);width:4px;height:20px}
ul.disc { list-style:disc }
ul.disc li { margin: 0 0 10px 20px; font-size: 15px; line-height:1.4em }
ul.bar li { position: relative; padding-left: 20px;  margin: 0 0 10px 30px }
ul.bar li:before { content:"-"; position:absolute; left:0px; top:0px }


/*** フッター ***/
footer { background-color: var(--navy); padding:180px 0 60px; position:relative; margin-top:400px }
footer::before{ position: absolute; content:""; background-image: url(../img/cmn/logo_big.svg); width: 360px; height: 360px; background-size: contain; background-repeat: no-repeat; position: absolute; left: 0px; bottom: 0; z-index: -1 }
.response_txt { font-size: 20px; margin-bottom:20px; position:relative; display: inline-block }
.response_txt::before, .response_txt::after { position: absolute; content:"";  width: 13.3px; height: 23px; background-size: contain; background-repeat: no-repeat; position: absolute; bottom: -1px }
.response_txt::before { background-image: url(../img/cmn/banzai_l.svg); left: -25px }
.response_txt::after { background-image: url(../img/cmn/banzai_r.svg); right: -25px }
footer .btn_blue { background: linear-gradient(180deg, var(--navy) 0%, var(--blue) 50%, var(--navy) 100%); background-size: 100% 200%; display: block; width:530px; height:160px; letter-spacing: 0.05em; text-align: center; box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25) }
footer .footer_tel { padding: 50px 0px 0px 85px }
footer .footer_web { padding: 50px 0px 0px 80px }
footer .btn_blue p { letter-spacing:0.05em }
footer .btn_blue p::before{ content:""; width: 40px; height: 40px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -45px; top: 0 }
footer .footer_tel p::before { width:70px; height:70px; left:-15px; background-image: url(../img/cmn/icon_phone.svg) }
footer .footer_web p::before { width:70px; height:53px; left:0px; background-image: url(../img/cmn/icon_mail.svg) }
.footer_tel p { font-size:38px }
.footer_tel p span { font-size:16px }
.footer_web { margin-left:20px }
.footer_web p { font-size:29px }
.footer_web p span { font-size:16px }
.footer_web p span.font_en { font-size:35px; display: inline-block; margin-right:5px }
.sec_response { margin:-330px auto 100px }
.footer_l { width:48% }
.footer_r { width:48% }
.sec_footer .sec_address { font-size: 15px; margin-bottom: 60px }
.footer_logo a p { position:relative; white-space: nowrap; margin-left: 65px; height: 100px }
.footer_logo a p::before{ content:""; background-image: url(../img/cmn/logo_mark.svg); width: 50px; height: 50px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -65px; top: 0 }
.footer_logo a p span { position: absolute; top: 34px; left: 0; font-size: 14px; font-weight: bold; letter-spacing: 0.06em }
.footer_logo img { width:220px }
.footer_r ul { flex-wrap: wrap; flex-direction: column; height: 200px }
.footer_r ul.menu_l { width:60%; align-content: flex-start }
.footer_r ul.menu_r { width:40% }
.footer_r ul.menu_l li { width:45%; height: 38px }
.footer_r ul.menu_r li { width:100%; height: 38px }
.sns a + a { margin-left: 10px }
.copyrights { float:right; margin-top:-14px; font-size:14px }
.btn_contact { position:fixed; bottom: 120px; right:0; background-color:rgba(1, 84, 134, 0.8); color:#fff; z-index: 2 }
.btn_contact a { padding:45px 0px 10px 0px; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; font-weight:bold; font-size:18px; letter-spacing:0.3em; position:relative; display:flex; align-items: center; width: 45px }
.btn_contact a:before { content:""; background-image: url(../img/cmn/icon_mail.svg); width: 20px; height: 14px; background-size: contain; background-repeat: no-repeat; position: absolute; top: 20px }
.btn_contact a:hover { opacity:0.8 }
.page_top {  opacity: 0; visibility: hidden }
.page_top.active{ opacity: 1; visibility: visible; transition: all .3s ease }
/* .page_top {  display: none; }
.page_top.active{ display: block; transition: all .3s ease } */


/*** scroll down/up アニメーション ***/
.scroll_down{ position:absolute;  bottom:0px;  left:80px}
.scroll_down p{ position:absolute;  left:-45px;  bottom:220px;  color:#fff;  font-size:14px;  letter-spacing:.2em;  writing-mode:vertical-lr;  text-decoration:none }
.scroll_down:before{ content:"";  position:absolute;  bottom:0;  left:-4px;  width:11px;  height:11px;  border-radius:50%;  background:#fff;  animation: circlemove 1.6s ease-in-out infinite, cirlemovehide 1.6s ease-out infinite}
@keyframes circlemove{ 0%{bottom:270px}
 100%{bottom:0px}
}
@keyframes cirlemovehide{
  0%{opacity:0}
 50%{opacity:1}
 80%{opacity:0.9}
 100%{opacity:0}
}

.scroll_down:after{ content:"";  position:absolute;  bottom:0;  left:0;  width:2px;  height:275px;  background:#fff}
.scroll_up{ display:block;  right:5px;  text-align:center;  bottom:10px;  position:fixed;  z-index:1}
.scroll_up p{ line-height:1.2em}
.scroll_up a{ display:inline-block;  line-height:18px;  font-size:11px;  font-weight:normal;  color:var(--blue);  letter-spacing:2px;  text-decoration:none}
.scroll_up .mouse{ position:relative;  display:block;  width:30px;  height:40px;  margin:0 auto 8px;  -webkit-box-sizing:border-box;  -moz-box-sizing:border-box;  box-sizing:border-box;  border:2px solid var(--blue);  border-radius:23px}
.scroll_up .mouse >*{ position:absolute;  display:block;  top:29%;  left:50%;  width:8px;  height:8px;  margin:-4px 0 0 -4px;  background:var(--blue);  border-radius:50%;  animation:ani-mouse 2.5s linear infinite}
@keyframes ani-mouse{ 0%{ opacity:1;  top:70%}
 15%{ opacity:1;  top:30%}
 50%{ opacity:0;  top:30%}
 100%{ opacity:0;  top:70%}
}
















@media screen and (max-width:1160px) {
  header section { width:1160px }
  .top_fv { width:1160px }
  .top_slider { width:1100px }
  .con_mission { width: 1120px }
  .con_mission .bg_white p { margin-left: 40px }
  .con_mission .bg_white h2 p { margin-left: 88px }
  .con_mission .bg_mission { right: -40px }
  .con_service { width:1160px }
  .con_service .hd_ttl_en { left: 13px }
  .con_service .service { margin-left: 100px; padding: 100px 40px 220px 100px }
  .con_service .service::before { width:1160px; height:789px }
  .con_case { width:1160px }
  .con_voice { width:1160px }
  .con_right { padding: 100px 0 0 40px }
  .con_flow { width:1160px; margin-left:0; padding: 100px 40px 100px 40px }
  .con_flow .hd_ttl_en hr { margin-left:0 }
  footer { width:1160px }
  .cld_header { width:1120px; margin-right:40px }
  .cld_contents { width:1160px }
  .hd_blue_gra { margin-left:-110px }
  .hd_blue_gra p span.no:before { left:20px }
  .csl_organization .hd_blue_gra { margin-right:-120px }
  .csl_organization .hd_blue_gra p span.no:before { left:40px }
  .csl_revenue p span + span { left:154px }
  .csl_profit p span + span { left:179px }
  .pg_case_lst .con_case { width:1160px }
  .pg_column_dtl .single .hd_blue_gra { margin-left: -40px; max-width: 1120px }
  .pg_column_dtl .single .hd_blue_gra h1 { margin: 40px 40px 0 80px }
  .pg_column_dtl .single .hd_blue_gra h1:before { left: -60px }
  .pg_case_dtl .single .hd_blue_gra { margin-left:-120px }
  .pg_case_dtl .single .hd_blue_gra h1 { margin: 40px 40px 0 80px }
  .con_column hr { width:1120px }
  .con_cousul2 { margin-right:0px; padding:60px 40px 160px 60px }
  .con_cousul2::before { right: 40px }
  .pg_case_dtl .case_box .hotel_type { left:80px }
  .pg_service2 .cld_contents { padding-right:0px }
  .pager_box { width:1160px }
}


@media screen and (min-width:1501px) {
  .cld_header { margin-right: 210px }
}


@media screen and (max-width:850px) {
  .pc-only { display:none !important }
  .sp-only { display:block !important }
  span.pc-only { display: none !important }

  /* p.txt { padding: 0 5vw } */

  .con_1160 { width: 100%; margin: 0 auto; padding: 0 5vw }
  .con_1080 { width: 100%; margin: 0 auto; padding: 0 0 }
  .con_800 { width: 100%; margin: 0 auto; padding: 0 5vw }
  .con_right { padding: 70px 5vw 140px }
  .cld_contents { margin: 60px auto 40px; padding: 0; width: 100% }

  .hd_ttl_en p { font-size:50px; line-height: 0.9em }
  .hd_ttl_en hr { margin-top:10px !important }
  .hd_ttl_en span { font-size: 17px; margin-top: 15px }

  .cld_header { position: relative }
  .cld_header .hd_ttl_en { position: absolute; right: 5vw; bottom: 20px }
  .cld_header .hd_ttl_en p { font-size:40px; line-height: 0.9em; padding-left: 5vw }
  .cld_header .hd_ttl_en hr { margin-top:5px !important; width: 95vw }
  .cld_header .hd_ttl_en span { font-size: 15px; margin-top: 6px }

  .hd_catch30 { font-size:22px }
  .hd_catch26 { font-size:22px }
  .hd_catch24 { font-size:22px }
  .hd_catch19 { font-size:19px }
  .bg_yellow .hd_catch24 { font-size: 18px }

  /* html { scroll-padding-top: 52px } */
  html { scroll-padding-top: 104px }
  header section { width:100%; padding:10px 12px; height: 52px }
  .header_logo a p { margin-left: 42px }
  .header_logo a p img { width:154px }
  .header_logo a p span { top: 24px; font-size: 10px }
  .header_logo a p::before { width: 33px; left: -42px }
  main { padding-top:72px }
  nav { opacity: 0; visibility: hidden }
  .cld_header { width:100%; margin-right:0; height: 160px }
  .cld_contents .bg_yellow { padding: 40px 7vw 40px }

  .hd_ttl_cld { font-size: 24px; margin-bottom: 40px; padding: 0 5vw }
  .hd_ttl_cld .font_en {font-size: 14px; margin-bottom: 8px }
  .hd_ttl_cld span.hr { margin-top: 20px !important }
  .hd_ttl_cld hr { width: 80px; height: 6px }
  .hd_ttl_cld + p.txt { line-height: 1.6em; padding: 0 5vw }
  .hd_ttl_en + div p.txt { line-height: 1.6em }

  /* ハンバーガーメニュー */
  .toggle { width: 30px }
  .toggle .p_menu, .p_close { font-size: 10px; font-weight: 500; margin:-2px 0 0 0; color: var(--blue) }
  .nav_toggle { display: block; position: relative; width: 1.9rem; height: 1.6rem; margin: 0 0 0 0; z-index: 3; cursor: pointer }
  .nav_toggle i { display: block; width: 100%; height: 7px; background-color: var(--blue); position: absolute; transition: transform .5s, opacity .5s; border-radius: 4px }
  .nav_toggle i:nth-child(1) { top: 0; width: 60% }
  .nav_toggle i:nth-child(2) { top: 4px; bottom: 0; margin: auto }
  .nav { position: fixed; top: 0; left: 0; right: 0; bottom: 0; padding: 1rem; opacity: 0; visibility: hidden; transition: opacity .5s, visibility .5s; background-color: rgba(255,255,255,0.98); z-index: 2; padding: 50px 5%; margin-top: 52px; transition: 0.3s }
  .child_header + .nav { padding: 120px 5% }
  .nav.sp-only.show { opacity: 1; visibility: visible; background-color: var(--navy); color: #fff; height: 100vh }
  .toggle .p_menu { display: block; transition: 0.3s }
  .toggle .p_close { display: none; transition: 0.3s }
  .nav_toggle.show + .p_menu { display: none }
  .nav_toggle.show + .p_menu + .p_close { display: block; z-index: 3; position: relative }
  .nav_toggle i:nth-of-type(1) { animation: menu-bar01 .75s forwards }
  @keyframes menu-bar01 {
    0% { transform: translateY(20px) rotate(45deg) } 
    50% { transform: translateY(20px) rotate(0) }
    100% { transform: translateY(0) rotate(0) }
  }
  .nav_toggle i:nth-of-type(2) { animation: menu-bar02 .75s forwards }
  @keyframes menu-bar02 {
    0% { transform: translateY(-20px) rotate(-45deg) }
    50% { transform: translateY(-20px) rotate(0)  }
    100% { transform: translateY(0) rotate(0) }
  }
  .nav_toggle.show i:nth-of-type(1) { animation: active-menu-bar01 .75s forwards; top: -13px; width: 85%; left:4px }
  @keyframes active-menu-bar01 {
    0% { transform: translateY(0) rotate(0) }
    50% { transform: translateY(20px) rotate(0) }
    100% { transform: translateY(20px) rotate(45deg) }
  }
  .nav_toggle.show i:nth-of-type(2) { animation: active-menu-bar03 .75s forwards; bottom: -31px; width: 85%; left:4px }
  @keyframes active-menu-bar03 { 
    0% { transform: translateY(0) rotate(0) }
    50% { transform: translateY(-20px) rotate(0) }
    100% { transform: translateY(-20px) rotate(-45deg) }
  }
  .show .nav_menu_ul li { padding: 20px 0 20px; border-bottom: 1px solid #000; font-size: 18px; font-weight: 500 }
  .show .nav_menu_ul li a { color: #000 }
  .show .nav_menu_ul li a.btn_orange { color: #fff }
  .show .nav_menu_ul li a.btn_orange:hover { color: var(--orange) }
  .show .nav_menu_ul li:nth-last-child(2) { border: none }
  .show .nav_menu_ul li:last-child { border: none; margin-top: 20px }
  .show .nav_menu_ul li a.list { display: flex; justify-content: center }
  .show .nav_menu_ul li a.list span:nth-child(1), .nav_menu_ul li a.list span:nth-child(3) { width: 40% }
  .show .nav_menu_ul li a.list span:nth-child(1) { text-align: right }
  .show .nav_menu_ul li a.list span:nth-child(2) { margin: 0 20px }
  .show .nav_menu_ul li a.list span:nth-child(3) { text-align: left }

  header section.show { background-color: rgba(255, 255, 255, 1) }
  .sp_menu { display: flex !important; flex-direction: row; z-index: 3 }
  .sp_head_tel { width: 35px; height: 35px; margin-right: 5px }
  .sp_head_tel img { width: 100% }

  .top_fv { width:100% }
  .top_slider { width:100% }
  .top_catch { width: 95%; padding: 25px 20px 15px 50px; right:0px; text-align:right; line-height: 3.5em }
  .scroll_down { left:10% }
  .scroll_down p { bottom: 97px; left: -39px; font-size: 12px }
  .scroll_down:after { height: 145px }
  .scroll_down:before{ content:"";  position:absolute;  bottom:0;  left:-4px;  width:11px;  height:11px;  border-radius:50%;  background:#fff;  animation: circlemove_sp 1.6s ease-in-out infinite, cirlemovehide_sp 1.6s ease-out infinite}
  @keyframes circlemove_sp{ 0%{bottom:140px}
   100%{bottom:0px}
  }
  @keyframes cirlemovehide_sp{
    0%{opacity:0}
   50%{opacity:1}
   80%{opacity:0.9}
   100%{opacity:0}
  }
  .top_catch .p1 { font-size:4.7vw; margin-left: -50px }
  .top_catch .p2 { font-size:7vw; line-height: 1.4em }
  .top_catch .p2 .big { font-size:12vw }
  .top_catch .p2 .big_x { font-size:15vw }
  .top_catch .p3 { font-size:4.9vw }
  .top_fv .slick-dots { bottom:-75px }

  /* .wrap_mission { margin-top: -1px; padding-top: 1px } */
  .con_mission { width:100%; padding: 180px 10% 60px 0; position:relative; margin-top: 160px }
  .con_mission .bg_white { padding: 40px 8% 20px 0 }
  .con_mission .bg_white p { margin-left: 8% }
  .con_mission .bg_white h2 p:before { width:5vw; height:5vw; left:-7vw; top: 5px }
  .con_mission .bg_white h2 p { margin-left:15vw }
  .con_mission .hd_ttl_en { position:absolute; top:-25px }
  .con_mission .bg_mission { background-size:cover; top: 80px; right:0; width:80%; height:80vw }
  .con_mission .bg_white p.hd_catch26 { margin-top:0 !important }

  .con_problem { margin-top:60px }
  .problem_dtl { font-size: 13px; margin-left: 0 }
  .problem_dtl p { margin-bottom: 10px; padding: 10px 10px 10px 11px; width: 85vw; transform: skewX(-170deg) }
  .problem_dtl p span { transform: skewX(170deg); display: flex;align-items: center;justify-content: flex-start;gap: 5px; line-height: 1.1em }
  .problem_dtl p span::before { width: 18px; margin-top: 3px; position: unset }
  .problem_dtl p + p { margin-left: 9px }
  .problem_dtl p + p + p { margin-left: 18px }
  .con_problem > div { flex-direction: column; align-items: center }
  .problem_dtl:last-child { margin-top: 20px; margin-left: 2% }
  .problem_dtl:last-child p { width: 85vw }
  .con_problem .hd_catch26 { font-size: 19px }
  .con_problem img { width: 50vw; height: 100px; margin-right: 20% }
  .con_problem::after { right: 2%; width: 120px; bottom: -30px; height: 173px }
  .arrow_three { margin-top: 20px }

  .con_service { width: 100%; margin-top: 9px; overflow: visible; ; overflow: hidden; padding-top: 20px }
  .con_consul { margin-left: 5vw; margin-right: -4vw; padding-bottom: 50px; border-bottom: none; position: relative }
  .con_consul:after { position: absolute; content: ""; background-color: #fff; width: 85vw; height: 2px; bottom: 0; right: 5vw  }
  .con_consul .consul { width: 100%; height: 360px; margin-top: 70px; margin-bottom: 0px }
  .con_service .service_ul { width: 100%; flex-direction: column; left: -5vw }
  .con_service .hd_ttl_en { left:1%; top: 0 }
  .con_service .hd_ttl_en::before { width: 18vw; height: 103vw }
  .con_service .service { margin-left: 5%; padding: 40px 4vw 160px 20vw }
  .con_service .hd_catch30 { font-size: 20px }
  .con_service .service_ttl { font-size: 20px; left: -5vw }
  .con_service .service_ttl::before { font-size: 11vw; left: -4vw; top: -5vw }
  .con_service .service_ttl + p { font-size: 3vw; right:5%; top: 4vw }
  .con_service .service_ttl + p span { top:-18vw; font-size: 18vw; right: 0% !important }
  .con_service .consul + .consul .service_ttl + p span { font-size:16vw; top: -16.5vw }
  .con_service .service_ul li { padding: 0 10px 0 35px; font-size: 15px; width: 68vw; margin-bottom: 10px; height: 90px }
  .con_service .service_dtl::before { left: -10px; top:45% }
  .con_consul .consul:nth-child(2) .service_ttl::before { font-size: 8vw; left: -14vw; top: -3vw }
  .con_service2 { flex-direction: column }
  .con_service2 h3 { padding: 0 0 0 35px !important; width: 60vw; font-size: 15px; height: 70px; left: 25px; top: 25px }
  .con_service2 li { width: 60vw; height: 70px; margin-top: 60px }
  .con_service2 .service_dtl::after { left:95px }
  .con_service2 h3:hover .service_dtl::after { left:100px }
  .con_service2 .s_system .service_dtl::after { left:120px }
  .con_service2 .s_system h3:hover .service_dtl::after { left:125px }
  .con_service2 .service_ttl { font-size: 24px }
  .con_service .btn_link { margin-top: 80px !important }
  .con_service .service::before { width: 250vw; height: 168vw; left: -72vw }
  .con_cousul2 .cousul2_box h3 { font-size:18px }
  .con_cousul2 .hd_catch24 { font-size:18px }

  .con_case { width: 100%; padding: 100px 5vw 60px; margin-top: -50px }
  .con_case .hd_ttl_en { margin-left: -6% }
  .con_case p.txt { text-align: left }
  .case_slider { width: 100%; float: unset }
  .top .case_list.con_1160 { float: unset; margin: 0 -5vw; width: 100vw }
  .case_img { width: 100%; height: auto }
  .case_box .hotel_type { font-size: 14px }
  .case_box .hotel_type .hotel_cat, .case_box .hotel_type .hotel_scale { padding:6px 8px }
  .case_ttl { margin: 10px 12px 10px; font-size: 17px }
  .case_box .hotel_type { top: -45px }
  .app_service ul li { font-size: 12px }
  .app_service ul { margin: 10px 10px 0 }
  .case_list li.case_li { padding: 20px 0px 15px }
  .case_list .slick-prev:before, .case_list .slick-next:before { font-size: 30px; opacity: 0.8 }
  .slick-prev, .slick-next { top: 180px; z-index: 1 }
  .case_list .slick-prev { left: 1vw }
  .case_list .slick-next { right: 4vw }
  .case_list .slick-prev:hover { left:1vw }
  .case_list .slick-next:hover { right:4vw }
  .con_case .btn_link { margin-top: 40px !important }

  .con_voice { width: 100%; position: relative; margin-bottom: 0px !important }
  .con_voice ul { margin-top: 40px }
  .con_voice ul li { font-size: 16px; padding: 15px 5vw; position: unset }
  .con_voice ul li:nth-child(odd) { margin-left: -5vw }
  .con_voice ul li:nth-child(even) { margin-right: -5vw }
  .con_voice .hd_ttl_en hr { margin-left: -5vw; width: calc(100vw - 140px) }
  .con_voice ul li:nth-child(1)::after { display:none }
  .con_voice ul li:nth-child(3)::after { width: 125px; right: 10px; top: 30px }
  .con_voice ul li:nth-child(5)::after { width: 125px; height: 110px; left: 15px; bottom: 0px }

  .con_flow { width: 100%; padding: 60px 5vw 40px 5vw; margin-top: -1px }
  .con_flow ul { flex-direction: column; margin-top: 50px !important }
  .con_flow ul li { padding: 10px 0 10px 0; margin: 0 0 32px 8px; width: unset; height: unset; letter-spacing: 0.05em; font-size: 16px }
  .con_flow ul li span { -ms-writing-mode: tb-unset;writing-mode: unset; width: unset; justify-content: center }
  .con_flow ul li::before { top: -13px; left:13px; font-size: 36px }
  .con_flow p.txt { text-align: left }
  .con_flow .hd_ttl_en hr { margin-left: -5vw }
  .con_flow ul li::after { transform: rotate(90deg); top: 65px; border: 80px solid transparent; border-left: 20px solid #555; height: 0; width: 0; left: 50%;transform:translate(-50%,-50%);-webkit-transform:rotate(90deg) translate(-50%, 33%);-ms-transform: rotate(90deg) translate(-50%, 33%) }

  .con_column { padding-bottom: 0px }
  .con_column hr { width: unset; margin-right: -5vw }
  .column_box { margin-top: 40px !important }
  .column_box > ul { flex-wrap: wrap }
  .column_list { width: 43vw; margin-bottom: 0 !important }
  .img_column { width: 100% ; height: auto }
  .txt_column .cat { margin-top: 10px !important; margin-bottom: 40px !important }
  .txt_column .date { font-size: 12px; margin-top: 10px !important }
  .txt_column .ttl { font-size: 14px; margin-top: 5px !important }
  .txt_column .cat li { font-size: 12px; padding: 5px 8px }
  .con_column .btn_link { margin: 10px 30px 60px !important }

  .cld_consul { overflow: hidden; margin-top: 40px !important }
  .cld_consul .consul { width: 90vw; padding: 0 6vw 80px; margin-bottom: 60px }
  .consul.csl_organization { margin-left: 10vw }
  .hd_blue_gra { min-width: 100% !important; margin-left: -6vw !important; width: 95vw; height: 80px }
  .hd_blue_gra p span.no:before { left: 5vw; width: 82px; height: 66px; top: 28px }
  .hd_blue_gra p span + span { left: 5vw; font-size: 12px; top: 12px }
  .hd_blue_gra h3 { margin: 42px 7vw 0 0; font-size: 20px}
  .hd_blue_gra h3:before { font-size: 40px; top: -28px; right: -3vw }
  .csl_organization .hd_blue_gra { margin-right: -6vw }
  .csl_organization .hd_blue_gra p span.no:before { left: 5vw; top: 30px }
  .csl_organization p span + span { top:18px }
  .csl_organization .hd_blue_gra h3:before { font-size: 28px; top: -20px }
  .csl_profit p span + span { top:18px }
  .csl_profit .hd_blue_gra p span.no:before { top: 30px }
  .cld_contents .service_txt .service_ttl { font-size: 22px }
  .cld_contents .service_box { flex-direction: column; margin-right: -16vw; padding: 25px 5vw 25px 6vw }
  .cld_contents .service_box ul { border-right:none; border-bottom:2px solid var(--navy); padding-right:unset; padding-bottom: 20px; font-size: 16px; min-width:unset !important }
  .cld_contents .service_box .txt { padding: 20px 0 0 0 !important }
  .cld_contents .service_box li { padding-left: 20px }
  .cld_contents .service_box li::before { left:4px }
  .csl_organization .service_box { margin-left: -16vw; margin-right: unset }
  .consul .btn_link { margin-right: unset; margin-top: 40px !important }
  .csl_organization .service_txt .service_ttl { padding-top: unset }
  .csl_organization .btn_link { margin-left: -8vw }
  .csl_revenue:before { top:130px; width: 65vw; height: 59vw; right: -11vw; z-index:-1 }
  .csl_organization:before { top:130px; width: 65vw; height: 64vw; left: -12vw; z-index:-1 }
  .csl_profit:before { top:130px; width: 50vw; height: 80vw; right: -11.5vw; z-index:-1 }
  .pg_service2 .cld_contents { margin-top: 60px !important; margin-bottom: 120px !important }
  .con_cousul2 { padding: 40px 6vw 30vw }
  .con_cousul2 .cousul2_box { padding:30px 6vw 15px }
  .con_cousul2 .cousul2_box ul li { line-height: 1.2em; margin-bottom: 15px }
  .con_cousul2::before { right: 0px; left: unset; width: 75vw; bottom: -15vw; height: 50vw }

  .pg_case_dtl .single .hd_blue_gra { margin-left: -5vw !important; max-width: unset; position: relative; ; display: flex; align-items: center }
  .pg_case_dtl .single .hd_blue_gra h1 { margin: 10px 5vw 0 8vw; font-size: 20px; text-align: left; position: unset }
  .single .hd_blue_gra h1:before { left: -1vw; top: 20px; font-size: 65px }
  .pg_case_dtl .case_box .hotel_type { left:8vw }
  .pg_case_lst .con_case { width: 100%; padding: 40px 0 0; margin-top: 40px }
  .pg_case_lst .con_case .case_list > ul { width: 100%; padding-bottom: 20px }
  .pg_case_lst .case_list li.case_li { width: 100%; margin-bottom: 50px !important }
  .pg_case_lst .case_box .hotel_type { top:-45px }
  .pg_case_lst .case_box .case_ttl { font-size: 24px }
  .pg_case_dtl .case_box { width:100%; padding: 0 5vw 80px; margin-bottom: 50px; margin-top: 40px !important }
  .case_dtl { flex-direction: column-reverse; gap:10px }
  .pg_case_dtl .bg_white { padding:74vw 6vw 0; margin-right: -5vw }
  .pg_case_dtl .eyecatch { width: 70%; top: 155px; right: 0px }
  .pg_case_dtl .app_ttl { font-size: 14px; margin-bottom: 0px }
  .pg_case_dtl .app_service { width: 100% }
  .pg_case_dtl .app_service ul { margin: 10px 0 0 }
  .case_dtl .case_l { min-width: 100%; width: 100%; margin-bottom: 60px }
  .case_dtl .case_r { margin-top: 30px }
  .pager .btn_link { width: 48% }
  .case_dtl .case_r > div { margin-bottom: 20px !important }
  .single .hd_blue_gra h1 br { display:block }

  .pager_box { width: 100% }
  .pager_box .pager { padding: 0 46px; margin-top: 100px !important }
  .btn_blue_box { margin-top: 40px; position: unset; transform:unset; -webkit-transform:unset; -ms-transform:unset }

  .cld_contents .column_box { margin-top: 60px !important }
  .blog-content :where(.wp-block-columns.is-layout-flex) { gap:1em }
  .pg_column_dtl .single .hd_blue_gra h1 { margin: 6px 5vw 0 5vw; font-size: 18px; text-align: left; position: unset }
  .pg_column_dtl .single .hd_blue_gra h1:before { left: -2vw !important; top: 20px; font-size: 65px }
  .pg_column_dtl .single .hd_blue_gra { margin-left:-5vw !important; max-width: unset; position: relative; ; display: flex; align-items: center }
  .cld_contents time { font-size:13px }
  .single .txt_column .cat li { font-size:14px; margin-right: 5px }
  .pg_column_dtl .cld_contents .column_box { margin-top: 40px !important }
  .category_name { flex-direction:column; font-size:18px }
  .category_name span.cat { margin: 10px 0px 5px 0 }
  .pg_column_cat .btn_blue_box { margin-top: 20px !important }

  .pg_company .bg_white { padding: 60px 6vw 60px !important }
  .pg_company .bg_white::before { width: 280px; height: 280px; right: -3vw; bottom: -40px }
  #company.cld_contents { margin-top: 80px !important }
  .pg_company .case_box { overflow: hidden }

  .table_01 { width: 90vw; table-layout: fixed; margin: 0 auto }
  .table_01 tr { border: 5px solid var(--lblue) }
  .table_01 tr th, .table_01 tr td { width: 100%; display: block; padding: 20px 5vw 20px 5vw }

  label { width: 100%; display: block; margin-bottom: 5px;}
  .mw_row span label { display: inline-block }
  .mw_row .notice { margin:10px 0 0 0 }
  .mw_row .error { margin:10px 0 0 0 }
  .mw_row span .error { margin:10px 0 0 0 }
  label + span { max-width: 100% }
  div.confirm { display: block }
  textarea#contents { margin-left: 0px }

  .pp_contents { padding: 0 5vw }

  .btn_contact { bottom:0px; left: 0 }
  .btn_contact a { display: block; -ms-writing-mode: unset; writing-mode: unset; font-size: 14px; letter-spacing: 0.1em; padding:8px 0px 8px 0px; display: flex; justify-content: center; gap: 5px; width: unset }
  .btn_contact a:before { position:unset; left:unset; top:unset }
  .scroll_up { bottom: 38px }
  .scroll_up a { font-size:8px }

  footer { margin-top: 200px !important; width: 100% }
  .sec_footer { flex-direction: column-reverse; align-items: center }
  footer .btn_blue { width: 90vw; height: 84px }
  .footer_web { margin-left: 0px }
  .sec_response { margin: -266px auto 50px }
  footer .footer_tel { padding: 20px 0 0 60px; margin-bottom: 10px }
  .footer_tel p { font-size: 22px; display: inline }
  footer .footer_tel p::before { width: 46px; height: 46px; left: -60px }
  .footer_tel p span { font-size: 12px }
  footer .footer_web { padding: 20px 0 0 60px }
  .footer_web p { font-size: 20px; display: inline }
  .footer_web p span.font_en { font-size: 22px }
  .footer_web p span { font-size: 12px }
  footer .footer_web p::before { width: 46px; height: 34px; left: -60px }
  .response_txt { font-size: 15px; padding: 0px 15px; margin-bottom: 10px; width:calc(100vw - 30px) }
  .response_txt::before { left:0px }
  .response_txt::after { right:0px }
  .con_response { flex-direction: column }
  .footer_l, .footer_r { width: 100% }
  .footer_l { margin-top: 50px }
  .footer_r { flex-direction: column; font-size: 14px; border-bottom: 2px solid #fff }
  .footer_r ul.menu_l { width: 100%; height: 160px; margin-bottom: 30px }
  .footer_r ul.menu_r { width: 100%; height: 96px }
  .footer_r ul li { width: 50% !important }
  .footer_r ul li { height: 32px !important }
  .footer_r ul { justify-content: flex-start; column-gap: 10px; margin-bottom: 30px }
  footer::before { width: 75vw; height: 75vw; bottom: 33px; right: 0; left: unset }
  .copyrights { margin-top: 30px; float: unset; font-size: 12px }
  .sec_footer .sec_address p.txt { font-size: 14px }
  footer .btn_blue.btn_blue1 { background: linear-gradient(180deg, var(--navy) 0%, #067FA6 100%); margin-bottom: 10px }
  footer .btn_blue.btn_blue2 { background: linear-gradient(180deg, #067FA6 0%, var(--blue) 100%) }
  footer .btn_blue:hover { background-position: 0% 100% !important }
  .txt_under.under_white:hover { background-size: unset; background-image: unset }
  .footer_r li a.list { transition: unset }

}



/* ふわっと表示（左右上下から）*/
.head-load-down { animation-name: fade-down; animation-duration: 0.5s }
.head-load-up { animation-name: fade-up; animation-duration: 0.5s }
.head-load-left { animation-name: fade-left; animation-duration: 0.5s }
.head-load-right { animation-name: fade-right; animation-duration: 0.5s }
.main-load-left { animation-name: load-left; animation-duration: 0.5s }
.main-load-right { animation-name: load-right; animation-duration: 0.5s }
@keyframes fade-down {
from { opacity: 0; transform: translateY(-20px) }
to { opacity: 1; transform: translateY(0) }
}
@keyframes fade-up {
from { opacity: 0; transform: translateY(20px) }
to { opacity: 1; transform: translateY(0) }
}
@keyframes fade-left {
from { opacity: 0; transform: translate(-20px,-20px) }
to { opacity: 1; transform: translate(0) }
}
@keyframes fade-right {
from { opacity: 0; transform: translate(20px,-20px) }
to { opacity: 1; transform: translate(0px) }
}
@keyframes load-left {
from { opacity: 0; transform: translateX(-200px) }
to { opacity: 1; transform: translateX(0) }
}
@keyframes load-right {
from { opacity: 0; transform: translateX(200px) }
to { opacity: 1; transform: translateX(0px) }
}
/* ふわっと表示（左右上下から）*/


/* ふわっと表示 */
.scroll-up{opacity: 0; transform: translateY(40px)/*スクロールアップする距離*/; transition: all 1s/*処理にかかる時間*/;}
.scroll-up.done, .scroll-fade.done{opacity : 1; transform : translate(0, 0);}
.load-up{opacity: 0; transform: translateY(40px)/*スクロールアップする距離*/; transition: all 1s/*処理にかかる時間*/;}
.load-up.done, .load-fade.done{opacity : 1; transform : translate(0, 0);}
.scroll-fade{opacity: 0; transition: all 0.5s/*処理にかかる時間*/;}
.load-fade {opacity : 0; transition : all 0.5s/*処理にかかる時間*/;}

/* recaptcha 非表示 */
.grecaptcha-badge { visibility: hidden }