﻿/*===============================================*/
/*  common.css */
/*===============================================*/
/*//////////////////////////////////

reset
///////////////////////////////////*/
/* Fonts
---------------------------------------------------------------------*/
/*localfont  -------------------------
@font-face {font-family: ftM; src: url('../fonts/Futura Heavy font.ttf');}
@font-face {font-family: ftB; src: url('../fonts/unicode.futurab.ttf');}*/
/*
font-family: 'Dosis', sans-serif;
font-family: 'Roboto', sans-serif;
*/
@font-face { font-family: 'icomoon'; src: url("../fonts/icomoon.eot?6ywhrr"); src: url("../fonts/icomoon.eot?6ywhrr#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf?6ywhrr") format("truetype"), url("../fonts/icomoon.woff?6ywhrr") format("woff"), url("../fonts/icomoon.svg?6ywhrr#icomoon") format("svg"); font-weight: normal; font-style: normal; font-display: block; }
[class^="icon-"], [class*=" icon-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'icomoon' !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-x:before { content: "\e90c"; }

.icon-back:before { content: "\e90a"; }

.icon-hide:before { content: "\e90b"; }

.icon-content-copy:before { content: "\e905"; }

.icon-view:before { content: "\e900"; }

.icon-link:before { content: "\e901"; }

.icon-line:before { content: "\e009"; }

.icon-search:before { content: "\e902"; }

.icon-mail:before { content: "\e903"; }

.icon-mail2:before { content: "\e904"; }

.icon-tel:before { content: "\e907"; }

.icon-home:before { content: "\e908"; }

.icon-youtube:before { content: "\e909"; }

.icon-mobile:before { content: "\e958"; }

.icon-heart1:before { content: "\e9db"; }

.icon-facebook:before { content: "\ea90"; }

.icon-instagram:before { content: "\ea92"; }

.icon-pdf:before { content: "\e906"; }

.icon-printer:before { content: "\e954"; }

.icon-heart:before { content: "\e9da"; }

.icon-mail:before { content: "\e903"; font-size: 2rem; position: relative; top: 3px; margin-right: 5px; }

.icon-columun:before { content: ''; display: inline-block; width: 46px; height: 46px; background-image: url(../img/insurance/icon_columun.png); background-size: contain; vertical-align: middle; }

.icon-mov:before { content: ''; display: inline-block; width: 46px; height: 46px; background-image: url(../img/insurance/icon_mov.png); background-size: contain; vertical-align: middle; }

.icon-arrow2:before { content: url("../img/common/icon_arrow2.svg"); position: relative; top: 4px; }

.icon-arrow:before { content: url("../img/common/icon_arrow.svg"); position: relative; top: 2px; }

.icon-arrow3:before { content: url("../img/company/icon_arrow3.svg"); position: relative; top: 4px; }

@media screen and (max-width: 768px) { .icon-columun:before { width: 40px; height: 40px; }
  .icon-mov:before { width: 40px; height: 40px; } }
/**/
/*site main rules
---------------------------------------------------------------------*/
/*color  ------------------*/
/*bgcolor  ------------------*/
.bgcBlu { background-color: #64C2EC; }

.bgcGrn { background-color: #62c7b5; }

.bgcNavy { background-color: #3168ab; }

.bgcGly { background-color: #f8f8f8; }

/**/
.clr-Blue { color: #64C2EC !important; }

.clr-Grn { color: #62c7b5 !important; }

.clr-Navy { color: #3168ab !important; }

/**/
.bd-blu { border-left: 3px solid #64C2EC !important; }

.bd-Grn { border-left: 3px solid #62c7b5 !important; }

.bd-Navy { border-left: 3px solid #3168ab !important; }

/*テキストのハイライトカラーを変える  ------------------*/
::selection { /* Safari and Opera */ background: #64C2EC; color: #111111; }

::-moz-selection { /* Firefox */ background: #64C2EC; color: #111111; }

/*link  ------------------*/
a:link { color: #111111; text-decoration: none; }

a:visited { color: #111111; text-decoration: none; }

a:hover { color: #111111; text-decoration: none; }

a:active { text-decoration: none; }

/* reset
---------------------------------------------------------------------*/
html { font-size: 62.5%; }

body { margin: 0; padding: 0; height: 100%; font-size: 1.6rem; /* 16px*/ line-height: 2; color: #111111; background-color: #fff; font-weight: 600; font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'Noto Sans JP', sans-serif; -webkit-text-size-adjust: 100%; }

/*responsive FONTS*/
.tx-80 { font-size: 8rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-60 { font-size: 6rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-36 { font-size: 3.6rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-32 { font-size: 3.2rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-26 { font-size: 2.6rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-24 { font-size: 2.4rem; line-height: 1; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-22 { font-size: 2.2rem; line-height: 1.8; font-weight: 800; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-20 { font-size: 2rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-18 { font-size: 1.8rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.05em; font-feature-settings: "palt"; }

.tx-16 { font-size: 1.6rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.08em; font-feature-settings: "palt"; }

.tx-15 { font-size: 1.5rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.05em; font-feature-settings: "palt"; }

.tx-14 { font-size: 1.4rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-13 { font-size: 1.3rem; line-height: 1; font-weight: 400; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-12 { font-size: 1.2rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.01em; font-feature-settings: "palt"; }

.tx-10 { font-size: 1rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.01em; font-feature-settings: "palt"; }

@media screen and (max-width: 768px) { .tx-36 { font-size: 2.4rem; line-height: 1.0; }
  .tx-32 { font-size: 2.1rem; }
  .tx-26 { font-size: 1.5rem; }
  .tx-24 { font-size: 2.2rem; }
  .tx-20 { font-size: 1.7rem; }
  .tx-18 { font-size: 1.6rem; line-height: 1.5; }
  .tx-16 { font-size: 1.5rem; }
  .tx-13 { font-size: 1.2rem; } }
html, body, h1, h2, h3, h4, h5, h6, a, p, span, em, small, strong, sub, sup, mark, del, ins, strike, abbr, dfn, blockquote, q, cite, code, pre, ol, ul, li, dl, dt, dd, div, section, article, main, aside, nav, header, hgroup, footer, img, figure, figcaption, address, time, audio, video, canvas, iframe, details, summary, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; }

h1, h2, h3, h4, h5, h6, p, address, ul, ol, li, dl, dt, dd, table, caption, th, td, img, form { font-style: normal; font-weight: normal; font-size: 14px; text-align: left; list-style-type: none; }
h1, h2, h3, h4, h5, h6 {
    line-height: revert;
}

/* Layout *********************************** */
article, aside, footer, header, nav, section, main { display: block; }

* { box-sizing: border-box; }

*:before, *:after { box-sizing: inherit; }

/* テキストエリア内文字サイズのブラウザ間での差異をなくす */
textarea { font-size: 100%; }

/* 画像の下にできる隙間をなくす */
img { border: 0; vertical-align: bottom; }

img { max-width: 100%; height: auto; width: auto; }

/* hr 要素は不可視で使う */
hr { display: none; }

/* br 要素のレスポンシブ化 */
/* none */
@media screen and (max-width: 1350px) { .brNone { display: none; } }
@media screen and (max-width: 768px) { .pc-Only { display: none; } }
@media screen and (min-width: 768px) { .sp-Only { display: none; } }
/* テキストインデント */
.txtindent { padding-left: 1.5em; text-indent: -1.5em; }

/*float
----------------------------------*/
.left { float: left; }

.right { float: right; }

#left { float: left; }

#right { float: right; }

/*txt-align
----------------------------------*/
.txt-align-l { text-align: left; }

.txt-align-r { text-align: right; }

/*//////////////////////////////////

module
///////////////////////////////////*/
/*background color
---------------------------*/
.bg-Mv { background: url(../img/top/main_visual.png) no-repeat center top; background-size: cover; }

.bg-Contact { background: url(../img/common/bg_contact.png) no-repeat center top; background-size: cover; }

.bg-Insu { background: url(../img/common/bgimg_insurance.png) no-repeat center top; background-size: cover; }

.bg-Real { background: url("../img/common/bgimg_real.png") no-repeat right top; background-size: cover; }

.bg-Faci { background: url("../img/common/bgimg_faci.png") no-repeat right top; background-size: cover; }

.bg-Cmn { background: url("../img/common/bgimg_cmn.png") no-repeat center top; background-size: cover; }

@media screen and (max-width: 768px) { .bg-Mv { background: url(../img/top/main_visual_sp.png) no-repeat center top; background-size: cover; }
  .bg-Contact { background: url("../img/common/bg_contact_sp.png") no-repeat center top; background-size: cover; }
  .bg-Insu { background: url(../img/common/bgimg_insurance_sp.png) no-repeat center top; background-size: cover; }
  .bg-Real { background: url("../img/common/bgimg_real_sp.png") no-repeat center top; background-size: cover; }
  .bg-Faci { background: url("../img/common/bgimg_faci_sp.png") no-repeat center top; background-size: cover; } }
/*inner
---------------------------*/
.inner { position: relative; margin: 0 auto; padding: 9rem 2rem 0; max-width: 1120px; }

.inner__Sub { position: relative; margin: 0 auto; padding: 2rem 2rem 0; max-width: 1020px; }

.inner__Contact { position: relative; margin: 0 auto; padding: 9rem 2rem; max-width: 1000px; }

@media screen and (max-width: 959px) { .inner { margin: 0 auto; padding: 5rem 2rem 0; }
  .inner__Sub { padding: 4rem 2rem 0; }
  .inner__Contact { padding: 6rem 2rem; } }
.inner2 { position: relative; margin: 100px auto; padding: 0rem 1rem; width: calc(100% - 200px); }

@media screen and (max-width: 768px) { .inner2 { margin: 30px auto; } }
/*flex-box
---------------------------*/
.flex-Sb { display: flex; flex-wrap: wrap; justify-content: space-between; }

.flex-Center { display: flex; flex-wrap: wrap; justify-content: space-around; }

.flex-St { display: flex; flex-wrap: wrap; justify-content: flex-start; }

.flex-Nomal { display: flex; flex-wrap: wrap; }

/*//////////////////////////////////
 animation
///////////////////////////////////*/
/*要素出現
---------------------------------*/
/* ------ animation style ------ */
/* fade fadeInDown */
@keyframes u-fadeInDown { 0% { transform: translate(0, -20px); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; } }
.u-fadeInDown span { opacity: 0; }

.u-fadeInDown.is-active span { opacity: 1; animation: u-fadeInDown 0.5s cubic-bezier(0.55, 0, 0.1, 1) both; }

.u-fadeInDown span:nth-child(1) { animation-delay: 0.1s; display: inline-block; }

.u-fadeInDown span:nth-child(2) { animation-delay: 0.2s; display: inline-block; }

.u-fadeInDown span:nth-child(3) { animation-delay: 0.3s; display: inline-block; }

.u-fadeInDown span:nth-child(4) { animation-delay: 0.4s; display: inline-block; }

.u-fadeInDown span:nth-child(5) { animation-delay: 0.5s; display: inline-block; }

.u-fadeInDown span:nth-child(6) { animation-delay: 0.6s; display: inline-block; }

.u-fadeInDown span:nth-child(7) { animation-delay: 0.7s; display: inline-block; }

.u-fadeInDown span:nth-child(8) { animation-delay: 0.8s; display: inline-block; }

.u-fadeInDown span:nth-child(9) { animation-delay: 0.9s; display: inline-block; }

.u-fadeInDown span:nth-child(10) { animation-delay: 1s; display: inline-block; }

.u-fadeInDown span:nth-child(11) { animation-delay: 1.1s; display: inline-block; }

.u-fadeInDown span:nth-child(12) { animation-delay: 1.2s; display: inline-block; }

.u-fadeInDown span:nth-child(13) { animation-delay: 1.3s; display: inline-block; }

/* fade up  ---------------*/
@keyframes u-fadeInUp { 0% { transform: translate(0, 20px); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; } }
.u-fadeInUp span { opacity: 0; }

.u-fadeInUp.is-active span { opacity: 1; animation: u-fadeInUp 0.5s cubic-bezier(0.55, 0, 0.1, 1) both; }

.u-fadeInUp span:nth-child(1) { animation-delay: 0.1s; display: inline-block; }

.u-fadeInUp span:nth-child(2) { animation-delay: 0.15s; display: inline-block; }

.u-fadeInUp span:nth-child(3) { animation-delay: 0.2s; display: inline-block; }

.u-fadeInUp span:nth-child(4) { animation-delay: 0.25s; display: inline-block; }

.u-fadeInUp span:nth-child(5) { animation-delay: 0.3s; display: inline-block; }

.u-fadeInUp span:nth-child(6) { animation-delay: 0.35s; display: inline-block; }

.u-fadeInUp span:nth-child(7) { animation-delay: 0.4s; display: inline-block; }

.u-fadeInUp span:nth-child(8) { animation-delay: 0.45s; display: inline-block; }

.u-fadeInUp span:nth-child(9) { animation-delay: 0.5s; display: inline-block; }

.u-fadeInUp span:nth-child(10) { animation-delay: 0.55s; display: inline-block; }

.u-fadeInUp span:nth-child(11) { animation-delay: 0.6s; display: inline-block; }

.u-fadeInUp span:nth-child(12) { animation-delay: 0.65s; display: inline-block; }

.u-fadeInUp span:nth-child(13) { animation-delay: 0.7s; display: inline-block; }

/* fade left  ---------------*/
@keyframes u-fadeInLeft { 0% { transform: translate(-20px, 0); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; } }
.u-fadeInLeft span { opacity: 0; }

.u-fadeInLeft.is-active span { opacity: 1; animation: u-fadeInLeft 0.5s cubic-bezier(0.55, 0, 0.1, 1) both; }

.u-fadeInLeft span:nth-child(1) { animation-delay: 0.1s; display: inline-block; }

.u-fadeInLeft span:nth-child(2) { animation-delay: 0.2s; display: inline-block; }

.u-fadeInLeft span:nth-child(3) { animation-delay: 0.3s; display: inline-block; }

.u-fadeInLeft span:nth-child(4) { animation-delay: 0.4s; display: inline-block; }

.u-fadeInLeft span:nth-child(5) { animation-delay: 0.5s; display: inline-block; }

.u-fadeInLeft span:nth-child(6) { animation-delay: 0.6s; display: inline-block; }

.u-fadeInLeft span:nth-child(7) { animation-delay: 0.7s; display: inline-block; }

.u-fadeInLeft span:nth-child(8) { animation-delay: 0.8s; display: inline-block; }

.u-fadeInLeft span:nth-child(9) { animation-delay: 0.9s; display: inline-block; }

.u-fadeInLeft span:nth-child(10) { animation-delay: 1s; display: inline-block; }

.u-fadeInLeft span:nth-child(11) { animation-delay: 1.1s; display: inline-block; }

.u-fadeInLeft span:nth-child(12) { animation-delay: 1.2s; display: inline-block; }

.u-fadeInLeft span:nth-child(13) { animation-delay: 1.3s; display: inline-block; }

/* fade right  ---------------*/
@keyframes u-fadeInRight { 0% { transform: translate(20px, 0); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; } }
.u-fadeInRight span { opacity: 0; }

.u-fadeInRight.is-active span { opacity: 1; animation: u-fadeInRight 0.5s cubic-bezier(0.55, 0, 0.1, 1) both; }

.u-fadeInRight span:nth-child(1) { animation-delay: 0.1s; display: inline-block; }

.u-fadeInRight span:nth-child(2) { animation-delay: 0.2s; display: inline-block; }

.u-fadeInRight span:nth-child(3) { animation-delay: 0.3s; display: inline-block; }

.u-fadeInRight span:nth-child(4) { animation-delay: 0.4s; display: inline-block; }

.u-fadeInRight span:nth-child(5) { animation-delay: 0.5s; display: inline-block; }

.u-fadeInRight span:nth-child(6) { animation-delay: 0.6s; display: inline-block; }

.u-fadeInRight span:nth-child(7) { animation-delay: 0.7s; display: inline-block; }

.u-fadeInRight span:nth-child(8) { animation-delay: 0.8s; display: inline-block; }

.u-fadeInRight span:nth-child(9) { animation-delay: 0.9s; display: inline-block; }

.u-fadeInRight span:nth-child(10) { animation-delay: 1s; display: inline-block; }

.u-fadeInRight span:nth-child(11) { animation-delay: 1.1s; display: inline-block; }

.u-fadeInRight span:nth-child(12) { animation-delay: 1.2s; display: inline-block; }

.u-fadeInRight span:nth-child(13) { animation-delay: 1.3s; display: inline-block; }

/* カーテン背景色  ---------------*/
@keyframes u-bgL { 0% { transform-origin: left; transform: scaleX(0); }
  50% { transform-origin: left; transform: scaleX(1); }
  50.001% { transform-origin: right; }
  100% { transform-origin: right; transform: scaleX(0); } }
.u-bgL { position: relative; z-index: 2; }

.u-bgL::after { content: ''; display: block; width: 100%; height: 100%; background-color: #3068AA; position: absolute; top: 0; right: 0; animation: u-bgL 1s ease 1.5s both; }

/*.u-fadeInSlide2.is-active::after{ }*/
/* fade  ---------------*/
.u-fade { opacity: 0; }

.u-fade.is-active { opacity: 1; transition: all 0.5s 2s; }

/* fadeUp ---------------*/
@keyframes u-fadeUp { 0% { transform: translate(0, 20px); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; } }
.u-fadeUp { opacity: 0; }

.u-fadeUp.is-active { opacity: 1; animation: u-fadeUp 0.5s cubic-bezier(0.55, 0, 0.1, 1) both; }

/* fadeDown ---------------*/
@keyframes u-fadeDown { 0% { transform: translate(0, -20px); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; } }
.u-fadeDown { opacity: 0; }

.u-fadeDown.is-active { opacity: 1; animation: u-fadeDown 0.5s cubic-bezier(0.55, 0, 0.1, 1) both; }

/* img slide ---------------*/
.u-fadeInSlide { position: relative; z-index: 2; }

.u-fadeInSlide::after { content: ''; display: block; width: 100%; transform: scaleX(1); transform-origin: 100% 0; height: 100%; background-color: #fff; position: absolute; top: 0; right: 0; }

.u-fadeInSlide.is-active::after { transition: all 0.5s 3s; transform: scaleX(0); }

/* single marker ---------------*/
.u-fadeInMarker { background: linear-gradient(to right, transparent 50%, rgba(255, 165, 0, 0.3) 50%); background-repeat: repeat-x; background-size: 200% .6em; background-position: 0 .6em; padding-bottom: .6em; }

.u-fadeInMarker.is-active { transition: all 1.2s ease; background-position: -100% .6em; }

/*delay-------------*/
.delay-05s.is-active { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; }

.delay-06s.is-active { -webkit-animation-delay: 0.6s; animation-delay: 0.5s; }

.delay-07s.is-active { -webkit-animation-delay: 0.7s; animation-delay: 0.5s; }

.delay-08s.is-active { -webkit-animation-delay: 0.8s; animation-delay: 0.5s; }

.delay-09s.is-active { -webkit-animation-delay: 0.9s; animation-delay: 0.5s; }

.delay-1s.is-active { -webkit-animation-delay: 1s; animation-delay: 1s; }

.delay-11s.is-active { -webkit-animation-delay: 11s; animation-delay: 1.1s; }

.delay-12s.is-active { -webkit-animation-delay: 12s; animation-delay: 1.2s; }

.delay-13s.is-active { -webkit-animation-delay: 13s; animation-delay: 1.3s; }

.delay-14s.is-active { -webkit-animation-delay: 14s; animation-delay: 1.4s; }

.delay-15s.is-active { -webkit-animation-delay: 15s; animation-delay: 1.5s; }

.delay-16s.is-active { -webkit-animation-delay: 16s; animation-delay: 1.6s; }

.delay-17s.is-active { -webkit-animation-delay: 17s; animation-delay: 1.7s; }

.delay-18s.is-active { -webkit-animation-delay: 18s; animation-delay: 1.8s; }

.delay-19s.is-active { -webkit-animation-delay: 19s; animation-delay: 1.9s; }

.delay-2s.is-active { -webkit-animation-delay: 2s; animation-delay: 2s; }

.delay-21s.is-active { -webkit-animation-delay: 21s; animation-delay: 2.1s; }

.delay-22s.is-active { -webkit-animation-delay: 22s; animation-delay: 2.2s; }

.delay-23s.is-active { -webkit-animation-delay: 23s; animation-delay: 2.3s; }

.delay-24s.is-active { -webkit-animation-delay: 24s; animation-delay: 2.4s; }

.delay-25s.is-active { -webkit-animation-delay: 25s; animation-delay: 2.5s; }

.delay-26s.is-active { -webkit-animation-delay: 26s; animation-delay: 2.6s; }

.delay-27s.is-active { -webkit-animation-delay: 27s; animation-delay: 2.7s; }

.delay-28s.is-active { -webkit-animation-delay: 28s; animation-delay: 2.8s; }

.delay-29s.is-active { -webkit-animation-delay: 29s; animation-delay: 2.9s; }

.delay-3s.is-active { -webkit-animation-delay: 3s; animation-delay: 3s; }

.delay-31s.is-active { -webkit-animation-delay: 3.2s; animation-delay: 3.2s; }

.delay-35s.is-active { -webkit-animation-delay: 3.5s; animation-delay: 3.5s; }

.delay-4s.is-active { -webkit-animation-delay: 4.5s; animation-delay: 4.5s; }

.delay-45s.is-active { -webkit-animation-delay: 4s; animation-delay: 4s; }

.delay-5s.is-active { -webkit-animation-delay: 5s; animation-delay: 5s; }

.delay-55s.is-active { -webkit-animation-delay: 5.5s; animation-delay: 5.5s; }

.delay-6s.is-active { -webkit-animation-delay: 6s; animation-delay: 6s; }

.delay-7s.is-active { -webkit-animation-delay: 7s; animation-delay: 7s; }

.delay-75s.is-active { -webkit-animation-delay: 7.7s; animation-delay: 7.7s; }

.delay-8s.is-active { -webkit-animation-delay: 8s; animation-delay: 8s; }

.delay-9s.is-active { -webkit-animation-delay: 9s; animation-delay: 9s; }

.delay-10s.is-active { -webkit-animation-delay: 10s; animation-delay: 10s; }

/*curtain
---------------------------------*/
.curtainIn { position: relative; opacity: 0; z-index: 0; }

.maskWH { width: 100%; height: 100%; position: absolute; top: 0; z-index: 5; background-color: #f7f5ed; }

.maskWH2 { width: 100%; height: 100%; position: absolute; top: 0; right: 0; background-color: #fff; }

.maskWH3 { width: 100%; height: 100%; position: absolute; top: 0; z-index: 5; background-color: #f8f8f8; }

.maskWH-wh { width: 100%; height: 100%; position: absolute; top: 0; z-index: 4; background-color: #e7e5e5; }

/*animation ------------*/
.ef-animation { animation: ef-animation 0s cubic-bezier(0.8, 0, 0.2, 1) 0s forwards; }

@keyframes ef-animation { 0% { opacity: 0; }
  100% { opacity: 1; } }
.ef-animation .maskWH { animation: maskWH 0.5s cubic-bezier(0.8, 0, 0.2, 1) 0.5s forwards; margin-left: 0; }

.ef-animation .maskWH2 { animation: maskWH2 0.5s cubic-bezier(0.8, 0, 0.2, 1) forwards; margin-right: 0; }

.ef-animation .maskWH3 { animation: maskWH 0.5s cubic-bezier(0.8, 0, 0.2, 1) 0.5s forwards; margin-left: 0; }

.ef-animation .maskWH-wh { animation: maskWH 0.7s ease-out 0.8s forwards; margin-left: 0; }

@keyframes maskWH { 0% { margin-left: 0; }
  100% { margin-left: 100%; } }
@keyframes maskWH2 { 0% { margin-right: 0; }
  100% { margin-right: 100%; } }
/*fade motion---------------------*/
.move, .move:hover { transition: all 0.2s ease-in-out 0.3s; }

.move2, .move2:hover { transition: all 4s ease-in-out 10s; }

.fade_box { -webkit-transform: translateY(30px); -moz-transform: translateY(30px); transform: translateY(30px); opacity: 0; }

/*button
---------------------------------*/
.link-Wrap { margin: 20px auto 0; width: 100%; text-align: center; }
.link-Wrap a { margin: 20px auto 0; }

.button-Main { position: relative; display: flex; justify-content: space-around; align-items: center; max-width: 210px; /* ボタンの最大幅 */ padding: 1em 2.7em 1em 2em; color: #3068AA; /* 文字色 */ transition: 0.3s ease-in-out; font-weight: 700; text-decoration: none; font-size: 1.6rem; }

.button-Main::before, .button-Main::after { content: ""; position: absolute; display: block; top: 50%; }

.bgc-blu::after { background: #64C2EC; }

.bgc-grn::after { background: #62c7b5; }

.bgc-navy::after { background: #3168ab; }

.button-Main::after { right: 0; z-index: 1; width: 3em; height: 3em; border-radius: 3em; transform: translateY(-50%); transition: all 0.5s; }

.button-Main span { position: relative; transition: all 0.3s; z-index: 3; }

.button-Main span::before, .button-Main span::after { position: absolute; top: 0; bottom: 0; right: 0; margin: auto; content: ""; vertical-align: middle; }

.button-Main span::before { right: -43px; width: 15px; height: 2px; background: #fff; }

.button-Main span::after { right: -44px; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* over */
.button-Main:hover span { color: #fff; /* 文字色 */ }

.button-Main:hover:after { right: 0; width: 100%; }

/**/
@media screen and (max-width: 768px) { .link-Wrap { margin: 10px auto 0; }
  .link-Wrap a { margin: 0px auto 0; }
  .button-Main { max-width: 150px; padding: 1em 1em 1em 1em; font-size: 1.4rem; }
  .button-Main::after { width: 2.5em; height: 2.5em; }
  .button-Main span { margin-right: 25px; }
  .button-Main span::before { right: -30px; width: 10px; height: 2px; background: #fff; }
  .button-Main span::after { right: -31px; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; } }
/**/
.button-Sub { cursor: pointer; display: inline-block; position: relative; vertical-align: middle; z-index: 0; transition: all 0.25s; padding: 1.2rem 1.2rem 1.2rem 3rem; width: 100%; height: auto; text-align: left; font-size: 1.6rem; font-weight: 600; border-radius: 50px; background-color: #64C2EC; color: #fff !important; letter-spacing: 0.05em; }

.button-Sub::before, .button-Sub::after { position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }

.button-Sub:hover { color: #fff; opacity: 0.8; }

.button-Navy { cursor: pointer; display: inline-block; position: relative; vertical-align: middle; z-index: 0; transition: all 0.25s; padding: 1.2rem 1.2rem 1.2rem 3rem; width: 100%; height: auto; text-align: left; font-size: 1.6rem; font-weight: 400; border-radius: 50px; background-color: #3168ab; color: #fff !important; letter-spacing: 0.05em; }

.button-Navy::before, .button-Navy::after { position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }

.button-Navy:hover { color: #fff; opacity: 0.8; }

.arrow-circle::before { left: 86%; width: 15px; height: 2px; background: #fff; }

.arrow-circle::after { left: 88%; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/**/
.button-Contact { cursor: pointer; display: inline-block; position: relative; vertical-align: middle; z-index: 0; transition: all 0.25s; margin: 0 auto; padding: 1.2rem 1.2rem 1.2rem 3rem; max-width: 250px; height: auto; text-align: left; font-size: 1.6rem; font-weight: 600; border-radius: 50px; background-color: #fff; letter-spacing: 0.05em; }

.button-Contact::before, .button-Contact::after { position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }

.button-Contact:hover { opacity: 0.6; }

/**/
.button-Real { cursor: pointer; display: inline-block; position: relative; vertical-align: middle; z-index: 0; transition: all 0.25s; padding: 0.6rem 0.8rem 0.6rem 3rem; width: 100%; height: auto; text-align: left; font-size: 1.6rem; font-weight: 400; border-radius: 50px; background-color: #62c7b5; color: #fff !important; letter-spacing: 0.05em; }

.button-Real::before, .button-Real::after { position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }

.button-Real:hover { color: #fff; opacity: 0.8; }

.arrow-circle2::before { left: 77%; width: 15px; height: 2px; background: #fff; }

.arrow-circle2::after { left: 80%; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/**/
.arrow-circle-blu::before { left: 86%; width: 15px; height: 2px; background: #64C2EC; }

.arrow-circle-blu::after { left: 88%; width: 10px; height: 10px; border-top: 2px solid #64C2EC; border-right: 2px solid #64C2EC; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.arrow-circle-grn::before { left: 86%; width: 15px; height: 2px; background: #62c7b5; }

.arrow-circle-grn::after { left: 88%; width: 10px; height: 10px; border-top: 2px solid #62c7b5; border-right: 2px solid #62c7b5; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.arrow-circle-navy::before { left: 86%; width: 15px; height: 2px; background: #3168ab; }

.arrow-circle-navy::after { left: 88%; width: 10px; height: 10px; border-top: 2px solid #3168ab; border-right: 2px solid #3168ab; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/**/
@media screen and (max-width: 768px) { .button-Contact { padding: 1rem 1rem 1rem 3rem; max-width: 250px; font-size: 1.5rem; }
  .arrow-circle-blu::before { left: 86%; width: 15px; height: 2px; background: #64C2EC; }
  .arrow-circle-blu::after { left: 88%; width: 10px; height: 10px; }
  .arrow-circle-grn::before { left: 86%; width: 15px; height: 2px; background: #62c7b5; }
  .arrow-circle-grn::after { left: 88%; width: 10px; height: 10px; }
  .arrow-circle-navy::before { left: 86%; width: 15px; height: 2px; background: #3168ab; }
  .arrow-circle-navy::after { left: 88%; width: 10px; height: 10px; } }
/*! #######################################################################

	HumbergerMenu

####################################################################### */
#sp-nav { display: none; }

@media screen and (max-width: 959px) { #sp-nav { display: inherit; position: fixed; height: auto; z-index: 100000; width: 100%; }
  /**/
  .gNav-Btn { width: 55px; height: 60px; border-radius: 3%; text-align: center; position: fixed; z-index: 100001; top: 0px; right: 0px; /*border-radius: 50%;
background: rgba(255, 255, 255, 0.7);*/ }
  /* #nav-toggle -------*/
  #nav-toggle { height: 70px; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  #nav-toggle div { margin: 25px auto 0; position: relative; width: 30px; }
  #nav-toggle span { display: block; position: absolute; height: 2px; width: 100%; background: #111; left: 0; zoom: 1; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out; }
  #nav-toggle span:nth-child(1) { top: 0; }
  #nav-toggle span:nth-child(2) { top: 8px; }
  #nav-toggle span:nth-child(3) { top: 16px; }
  .open #nav-toggle { background: transparent; }
  .open #nav-toggle span { background: #111; }
  .open #nav-toggle span:nth-child(1) { top: 9px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); zoom: 1; }
  .open #nav-toggle span:nth-child(2) { width: 0; left: 50%; }
  .open #nav-toggle span:nth-child(3) { top: 9px; -webkit-transform: rotate(135deg); transform: rotate(135deg); zoom: 1; }
  /*#nav-toggle p{ 	padding-top:15px; 	font-size:14px; 	text-align: center; 	color:#cf000e; 	font-family: dcb; }  .open #nav-toggle p{ 	color:#fff;}*/
  /**/
  div#humberger { position: absolute; height: auto; z-index: 100000; width: 100%; display: block; }
  /* *********************************************************** #global-nav *********************************************************** */
  nav#h-nav { visibility: hidden; position: fixed; display: block; vertical-align: middle; height: 100%; width: 100%; top: 0; right: 0; transition: all .3s ease-in-out; transform: translatex(100%); }
  nav#h-nav .hWrap { position: absolute; height: 100%; width: 100%; top: 0%; right: 0; overflow-y: scroll; -webkit-overflow-scrolling: touch; }
  .open nav#h-nav { z-index: 1; visibility: visible; width: 100%; height: 100%; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; transform: translatex(0%); opacity: 1; background-color: #fff; }
  /* *********************************************************** nav-list *********************************************************** */
  .spNav__H1 { position: relative; z-index: 1000000; top: 0px; padding: 1.5rem 1.5rem 2.5rem 1.5rem; width: 100%; border-bottom: 1px solid #E6E6E6; }
  .spNav__H1 h1 { width: 250px; }
  .spNav__main { margin: 0px auto 5px; padding: 0; width: 100%; height: auto; }
  .spNav__main li { width: 100%; height: auto; font-size: 1.4rem; line-height: 20px; font-weight: 700; opacity: 0; }
  .spNav__Item .pdng { padding: 1.4rem; border-bottom: 1px solid #E6E6E6; }
  .spNav__main li a { display: block; position: relative; text-align: left; color: #111; text-decoration: none; transition: all 0.2s; }
  .spNav__main li a:hover { color: #3068AA !important; }
  .spNav__main li ul { padding: 0; background-color: #F8F8F8; }
  .spNav__main li ul li { margin: 0 auto; width: 90%; padding: 1.4rem 0; font-weight: 400 !important; border-bottom: 1px solid #E6E6E6; }
  .spNav__main li ul li:last-child { border-bottom: none; }
  /*アコーディオン ------------------------------*/
  .toggle_title { position: relative; font-size: 1.4rem; font-weight: 700 !important; padding: 1.4rem; cursor: pointer; border-bottom: 1px solid #E6E6E6; }
  .toggle_btn { position: absolute; top: 50%; right: 3%; transform: translateY(-50%); background: #555555; display: block; width: 24px; height: 24px; text-indent: 100%; white-space: nowrap; overflow: hidden; border-radius: 50%; }
  .toggle_btn:before, .toggle_btn:after { display: block; content: ''; background-color: #fff; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .toggle_btn:before { width: 2px; height: 10px; }
  .toggle_title.selected .toggle_btn:before { content: normal; }
  .toggle_contents dd { display: none; }
  .toggle_btn { position: absolute; top: 50%; right: 3%; transform: translateY(-50%); background-color: #fff; border: 1px solid #555555; display: block; width: 24px; height: 24px; text-indent: 100%; white-space: nowrap; overflow: hidden; border-radius: 50%; }
  .toggle_btn:before, .toggle_btn:after { display: block; content: ''; background-color: #555555; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .toggle_btn:before { width: 2px; height: 10px; }
  .toggle_title.selected .toggle_btn:before { content: normal; }
  .toggle_title.selected .toggle_btn { position: absolute; top: 50%; right: 3%; transform: translateY(-50%); background-color: #555555; border: 1px solid #555555; display: block; width: 24px; height: 24px; text-indent: 100%; white-space: nowrap; overflow: hidden; border-radius: 50%; }
  .toggle_title.selected .toggle_btn:before, .toggle_title.selected .toggle_btn:after { display: block; content: ''; background-color: #fff; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .toggle_contents dd { display: none; }
  /* .toggle_btn { 	position: absolute; 	top: 50%; 	right: 3%; 	transform: translateY(-50%); 	background: #555555; 	display: block; 	width: 24px; 	height: 24px; 	text-indent: 100%; 	white-space: nowrap; 	overflow: hidden; 	border-radius: 50%; } .toggle_btn:before, .toggle_btn:after { 	display: block; 	content: ''; 	background-color: #fff; 	position: absolute; 	width: 10px; 	height: 2px; 	top: 50%; 	left: 50%; 	transform: translate(-50%, -50%); } .toggle_btn:before { 	width: 2px; 	height: 10px; } .toggle_title.selected .toggle_btn:before { 	content: normal; } .toggle_contents dd { 	display: none; }	*/
  .open nav#h-nav .spNav__main li { opacity: 1; -webkit-transform: scaleX(1) translateX(0); transform: scaleX(1) translateX(0); -webkit-transition: all 0.5s ease-out 0.3s; transition: all .5s ease-out .3s; }
  /*その他 ------------------------------*/
  /*inner ---------------------------*/
  .spNav__Inner { position: relative; margin: 0 auto; padding: 1rem 0; width: 90%; }
  /* spNav__Tel----------*/
  .spNav__Tel { margin: 0; padding-bottom: 2rem; width: 100%; position: relative; border-bottom: 1px solid #E6E6E6; }
  .spNav__Tel p { text-align: center; }
  .spNav__Tel div { font-size: 2.4rem; line-height: 1.0; text-align: center; color: #111111; font-weight: 500 !important; font-family: 'Roboto Condensed', sans-serif; }
  .spNav__Tel div span { font-size: 1.8rem; }
  /* @media (min-width: 768px) { .spNav__Tel a[href*="tel:"] {pointer-events: none;cursor: default;text-decoration: none;} }*/
  /* spNav__sub----------*/
  .spNav__sub { padding: 2rem 0; width: 100%; position: relative; border-bottom: 1px solid #E6E6E6; }
  .spNav__sub li { margin-bottom: 15px; width: 100%; }
  .spNav__sub li:last-child { margin-bottom: 0px; }
  .spNav__Copy { margin: 10px auto; color: #777777; font-size: 1rem; line-height: 1.1; font-weight: 500; letter-spacing: 0.05em; } }
/* ***********************************************************
* #iconList
* *********************************************************** */
.iconList { margin: 0 auto; padding: 2rem; max-width: 400px; height: auto; opacity: 0; }

.iconList h3 { margin-bottom: 10px; font-size: 2rem; line-height: 20px; color: #fff; letter-spacing: 0.05em; font-feature-settings: "palt"; font-family: ftM; }

.iconList i { width: 0px; height: 0px; margin: 0 5px; }

.open nav#sp-NavMain .iconList { opacity: 1; -webkit-transition: all 0.5s ease-out 0.6s; transition: all .5s ease-out .6s; }

.open nav#sp-NavMain .iconList span { font-size: 20px; transition: .3s; color: #fff; }

.open nav#sp-NavMain .iconList span:hover { color: #000; }

/*//////////////////////////////////

Header
///////////////////////////////////*/
header { margin: 0 auto; padding: 2.2rem 2rem 0 3rem; width: 100%; height: 110px; background: white; position: fixed; z-index: 1000; top: 0; transition: .5s; border-bottom: 1px solid #E6E6E6; }

header h1 { margin-top: 30px; width: 38%; position: relative; }
header h1 img { width: 430px; }

/*変形header*/
header.transform { background: white; }

/**/
/*- @media 768px-*/
@media screen and (max-width: 959px) { header { padding: 1rem 1rem 2.2rem; width: 100%; height: 60px; align-items: flex-end; }
  header h1 { margin-top: 0px; width: 230px !important; } }
/*//////////////////////////////////

G_Nav
/////////////////////////////////*/
nav { width: 60%; height: auto; position: relative; z-index: 9999; }

nav .nav__Tel { margin: 0 0px 20px auto; padding: 0; width: 200px; height: auto; position: relative; font-size: 2.4rem; line-height: 1.0; text-align: center; color: #111111; font-weight: 600; font-family: 'Roboto Condensed', sans-serif; }
nav .nav__Tel span { font-size: 1.8rem; }

nav .gnavList { margin: 0 -22px 0 auto; padding: 0; width: 600px; height: auto; position: relative; z-index: 0; display: flex; flex-wrap: wrap; }

nav .gnavList li { padding: 0; width: 25%; }

nav .gnavList li a { display: block; padding: 0 0 2rem; width: 82%; height: auto; font-size: 1.7rem; line-height: 1.0; text-align: center; color: #111111; font-weight: 700; font-family: 'Noto Sans JP', sans-serif; }

.gnavList__item1 { width: 50% !important; }

/*dropmenu-------*/
nav .dropmenu ul { position: relative; z-index: 9999; bottom: -7px; left: -12px; margin: 0; padding: 0; }

nav .dropmenu ul li { width: 80%; }

nav .dropmenu ul li a { padding: 1.5rem 1rem 2rem 1rem; width: 100%; height: 100%; color: #111; font-size: 1.6rem; border-top: 1px dotted #fff; background: #F8F8F8; text-align: center; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 400; transition: .2s; }

nav .dropmenu ul li a:hover { background: #e0eff6; }

/**/
#drop li ul { width: 100%; overflow: hidden; height: 0; transition: .2s; }

#drop li ul li { width: 100%; font-size: 16px; overflow: hidden; height: 0; transition: .2s; }

#drop li:hover ul li { overflow: visible; height: 50px; }

#drop li:hover ul { width: 100%; padding: 0 0; overflow: visible; height: 160px; background: #F8F8F8; border-radius: 10px; box-shadow: 0 0 6px 1px rgba(85, 85, 85, 0.15); }

/* nav----------*/
.buttonNavPc { position: relative; z-index: 1; display: block; width: 100%; transition: all 0.25s; }

.buttonNavPc:after { content: ''; /*絶対配置で線の位置を決める*/ position: absolute; bottom: -7px; left: 10%; /*線の形状*/ width: 80%; height: 4px; background: #3068AA; /*アニメーションの指定*/ transition: all .3s; transform: scale(1, 0); /*X方向0、Y方向1*/ transform-origin: left bottom; /*左上基点*/ }

.buttonNavPc:hover:after { transform: scale(1, 1); }

.buttonNavPc:hover { color: #3068AA !important; }

.current { position: relative; color: #3068AA !important; width: 100%; }

.current:after { content: ""; position: absolute; z-index: 10; left: 10%; bottom: -7px; width: 80%; height: 3px; background-color: #3068AA; }

/*- @media 959px-*/
@media screen and (max-width: 959px) { nav { display: none; } }
#first-View { width: 100%; position: relative; }

.top-View { margin-top: 110px; padding: 10rem; height: 700px; }

.sub-View__ttl { margin-top: 110px; padding: 8rem 8rem; height: 220px; }
.sub-View__ttl h2 { font-weight: 700; font-family: 'Noto Sans JP', sans-serif; }

/*
.sub-View__Wrap{
	width: 100%;
	position: relative;
	padding:1rem 8rem; }

.sub-View__Nav{
	width: 100%;
	display: flex; flex-wrap: wrap; list-style: none;

	li{a{color: #fff; transition: 0.25s;}}}

.sub-View__Nav li:not(:last-of-type)::after { content: "|"; margin: 1em;  color: #fff; }

.sub-View__Nav a:hover{opacity: 0.6;}*/
/**/
.sub-View__breadcrumb { padding: 1rem 8rem; display: flex; flex-wrap: wrap; list-style: none; }

.sub-View__breadcrumb li:not(:last-of-type)::after { content: "›"; margin: 0 .6em; color: #111111; }

.sub-View__breadcrumb li a:hover { opacity: 0.6; text-decoration: none !important; }

.breadcrumb-Over { color: #3068AA !important; text-decoration: underline !important; }

@media screen and (max-width: 1140px) { .sub-View__ttl { padding: 8rem 2rem; }
  .sub-View__Wrap { padding: 1rem 2rem; }
  .sub-View__breadcrumb { padding: 1rem 2rem; } }
/*- @media 959px-*/
@media screen and (max-width: 959px) { .top-View { margin-top: 60px; }
  .sub-View__ttl { margin-top: 60px; padding: 8rem 2rem; height: 220px; }
  .sub-View__Wrap { padding: 1rem 2rem; }
  .sub-View__breadcrumb { padding: 1rem 2rem; } }
/*- @media 768px-*/
@media screen and (max-width: 768px) { .top-View { margin-top: 60px; padding: 0rem 0 0rem; height: 440px; }
  .sub-View__ttl { margin-top: 60px; padding: 6rem 2rem; height: 150px; }
  .sub-View__breadcrumb { display: none; } }
.hero-Header { position: absolute; bottom: 13%; left: 5%; margin: 0; padding: 0; }
.hero-Header span { display: block; margin-bottom: 20px; font-size: 8rem; line-height: 0.8; font-weight: 700; letter-spacing: 0.01em; font-feature-settings: "palt"; font-family: 'Roboto Condensed', sans-serif; background: -webkit-linear-gradient(0deg, #65c2ed, #3a75b7, #3a75b7); /* 背景色にグラデーションを指定 */ color: #64C2EC; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.hero-Header h2 { margin-bottom: 20px; }
.hero-Header h3 { font-family: 'Noto Sans JP', sans-serif; font-weight: bold; font-size: 2.9rem; line-height: 1; }

@media screen and (max-width: 768px) { .hero-Header { bottom: 8%; left: 15px; }
  .hero-Header span { margin-bottom: 10px; font-size: 4.5rem; line-height: 0.8; }
  .hero-Header h2 { margin-bottom: 10px; width: 250px; }
  .hero-Header h3 { font-size: 1.5rem; } }
.sub-Header { position: relative; margin: 0 auto; padding: 0 2rem; max-width: 1400px; height: auto; }
.sub-Header h4 { margin-top: 50px; color: #3068AA; }

.sub-Header__Ttl { position: relative; margin: 0 auto; padding: 0 auto 40px; width: 100%; height: auto; }
.sub-Header__Ttl h2 { margin-bottom: 0px; font-size: 7rem; line-height: 70px; font-weight: 600; color: #3068AA; letter-spacing: 0.01em; font-feature-settings: "palt"; font-family: ftM; }

/**/
.sub-Header__Nav ul { width: 100%; margin-top: 20px; padding-top: 20px; }
.sub-Header__Nav ul li { font-weight: 500; padding: 0 3rem; display: inline-block; border-right: 1px solid #f8f8f8; }
.sub-Header__Nav ul li:first-child { padding-left: 0; }
.sub-Header__Nav ul li:last-child { border-right: none; }
.sub-Header__Nav ul li a { display: block; position: relative; transition: all 0.25s; }

.sub-Header__Nav a:hover { color: #3068AA; }

.sub-Header__Nav .over { color: #3068AA; }

.bd-Top { border-top: 1px solid #f8f8f8; }

@media screen and (max-width: 768px) { .sub-Header h4 { margin-top: 20px; color: #3068AA; }
  .sub-Header__Ttl h2 { font-size: 3rem; line-height: 30px; }
  .sub-Header__Nav ul { margin-top: 20px; padding-top: 0px; border: 1px solid #f8f8f8; }
  .sub-Header__Nav ul li { padding: 0rem; width: 100%; border-bottom: 1px solid #f8f8f8; border-right: none; }
  .sub-Header__Nav ul li:last-child { border-bottom: none; }
  .sub-Header__Nav ul li a { display: block; position: relative; transition: all 0.25s; padding: 1.5rem; text-align: center; } }
/*//////////////////////////////////

Contents
/////////////////////////////////*/
main { margin: 0 auto; padding: 0; width: 100%; height: auto; position: relative; overflow: hidden; }

/*h2ttl-Wrap
---------------------------*/
.h2ttl-Wrap { margin-bottom: 40px; }
.h2ttl-Wrap h2 { display: block; font-size: 6rem; line-height: 0.8; font-weight: 700 !important; letter-spacing: 0.01em; font-feature-settings: "palt"; font-family: 'Roboto Condensed', sans-serif; background: -webkit-linear-gradient(0deg, #65c2ed, #3a75b7, #3a75b7); /* 背景色にグラデーションを指定 */ color: #64C2EC; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.h2ttl-Wrap span { display: block; margin-top: 10px; font-size: 2rem; line-height: 1; font-weight: 700; letter-spacing: 0.01em; color: #111111; font-feature-settings: "palt"; font-family: 'Noto Sans JP', sans-serif; }

@media screen and (max-width: 768px) { .h2ttl-Wrap { margin-bottom: 20px; }
  .h2ttl-Wrap h2 { font-size: 4rem; }
  .h2ttl-Wrap span { margin-top: 5px; font-size: 1.7rem; }
  .h2ttl-Wrap-Sub h2 { font-size: 3rem; line-height: 30px; }
  .h2ttl-Wrap-Sub span { margin-top: 5px; font-size: 1.7rem; } }
/*page-top
---------------------------*/
#page-top { width: 70px; height: 70px; display: none; position: fixed; right: 0.5%; bottom: 40px; z-index: 1000; }

#page-top p { margin: 0; padding: 0; text-align: center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#move-page-top { color: #fff; line-height: 50px; text-decoration: none; display: block; cursor: pointer; }

/*- @media 768px-*/
@media screen and (max-width: 768px) { #page-top p { display: none; } }
/*////////////////////////////////

footer
////////////////////////////////*/
footer { margin: 0 auto; width: 100%; }

/*fInner-----------------*/
.foot__Inner { margin: 0 auto 0; padding: 0 5rem 5rem; width: 100%; position: relative; font-family: 'Noto Sans JP', sans-serif; }

/*---------*/
.foot__left-Wrap { position: relative; width: 30%; }
.foot__left-Wrap h1 { margin-top: -10px; margin-bottom: 20px; }
.foot__left-Wrap h1 img { width: 350px; }
.foot__left-Wrap .adrs { margin-top: 10px; display: block; font-size: 1.3rem; line-height: 1.5; font-weight: 400; letter-spacing: 0.05em; font-feature-settings: "palt"; }

/*---------*/
.foot__right-Wrap { margin: 0; padding: 0; width: 60%; position: relative; }

.foot__fList { margin: 0 0 0 auto; padding: 0; position: relative; }
.foot__fList li { width: 23%; }
.foot__fList li .fList__Ttl { margin-bottom: 10px; font-size: 1.5rem; line-height: 1.8; font-weight: 700; letter-spacing: 0.05em; font-feature-settings: "palt"; }
.foot__fList li .fList__Ttl a { display: block; transition: 0.25s; }
.foot__fList li p { position: relative; margin-top: 5px; padding-left: 14px; font-size: 1.3rem; line-height: 1.8; font-weight: 400; letter-spacing: 0.05em; font-feature-settings: "palt"; }
.foot__fList li p:before { content: ""; display: block; width: 8px; height: 1px; background-color: #3068AA; position: relative; top: 13px; left: -13px; }
.foot__fList li p a { display: block; transition: 0.25s; }

/**/
.foot__Wrap { width: 100%; margin: 50px auto 0; padding: 0; position: relative; }
.foot__Wrap .foot__subLink { width: 630px; }
.foot__Wrap .foot__subLink li { display: inline-block; margin-right: 15px; }
.foot__Wrap .foot__subLink li a { display: block; transition: 0.25s; line-height: 1; }
.foot__Wrap .copy { line-height: 2; text-align: right; color: #777777; }

.foot__fList a:hover, .foot__subLink a:hover { opacity: 0.6; }

.footNav-sp { display: none; }

/*- @media 1100px-*/
@media screen and (max-width: 1140px) { .foot__Wrap { margin: 30px auto 0; }
  .foot__Wrap .foot__subLink { width: 100%; margin-bottom: 30px; }
  .foot__Wrap .foot__subLink li { display: inline-block; margin-right: 15px; }
  .foot__Wrap .copy { line-height: 1.5; width: 100%; text-align: left; } }
/*- @media 959px-*/
@media screen and (max-width: 959px) { .foot__Inner { padding: 3rem 2rem; }
  .foot__left-Wrap { width: 100%; margin-bottom: 50px; }
  .foot__left-Wrap h1 { margin-top: 0px; margin-bottom: 20px; }
  .foot__left-Wrap h1 img { width: 280px; }
  .foot__left-Wrap .adrs { margin-top: 10px; font-size: 1.3rem; line-height: 1.5; }
  .foot__right-Wrap { display: none; }
  .foot__Wrap { margin: 0px auto 0; }
  .foot__Wrap .foot__subLink { width: 100%; margin-bottom: 10px; }
  .foot__Wrap .foot__subLink li { display: block; margin-right: 0px; margin-bottom: 20px; }
  .foot__Wrap .copy { line-height: 1.5; width: 100%; text-align: left; }
  /* *********************************************************** footNav-sp / スマホ限定 *********************************************************** */
  .footNav-sp { display: inherit; position: relative; margin: 0px auto 40px; padding: 0; width: 100%; height: auto; }
  .footNav-sp__main { width: 100%; height: auto; }
  .footNav-sp__main li { width: 100%; height: auto; font-size: 1.4rem; line-height: 20px; font-weight: 700; }
  .footNav-sp__Item .pdng { padding: 1.4rem; border-bottom: 1px solid #E6E6E6; }
  .footNav-sp__main li a { display: block; position: relative; text-align: left; color: #111; text-decoration: none; transition: all 0.2s; }
  .footNav-sp__main li a:hover { color: #3068AA !important; }
  .footNav-sp__main li ul { padding: 0; background-color: #F8F8F8; }
  .footNav-sp__main li ul li { margin: 0 auto; width: 90%; padding: 1.4rem 0; font-weight: 400 !important; border-bottom: 1px solid #E6E6E6; }
  .footNav-sp__main li ul li:last-child { border-bottom: none; }
  .bdr-top { border-top: 1px solid #E6E6E6; }
  /*アコーディオン ------------------------------*/
  .toggle_title { position: relative; font-size: 1.4rem; font-weight: 700 !important; padding: 1.4rem; cursor: pointer; border-bottom: 1px solid #E6E6E6; }
  .toggle_btn { position: absolute; top: 50%; right: 3%; transform: translateY(-50%); background: #555555; display: block; width: 24px; height: 24px; text-indent: 100%; white-space: nowrap; overflow: hidden; border-radius: 50%; }
  .toggle_btn:before, .toggle_btn:after { display: block; content: ''; background-color: #fff; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .toggle_btn:before { width: 2px; height: 10px; }
  .toggle_title.selected .toggle_btn:before { content: normal; }
  .toggle_contents dd { display: none; }
  .toggle_btn { position: absolute; top: 50%; right: 3%; transform: translateY(-50%); background-color: #fff; border: 1px solid #555555; display: block; width: 24px; height: 24px; text-indent: 100%; white-space: nowrap; overflow: hidden; border-radius: 50%; }
  .toggle_btn:before, .toggle_btn:after { display: block; content: ''; background-color: #555555; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .toggle_btn:before { width: 2px; height: 10px; }
  .toggle_title.selected .toggle_btn:before { content: normal; }
  .toggle_title.selected .toggle_btn { position: absolute; top: 50%; right: 3%; transform: translateY(-50%); background-color: #555555; border: 1px solid #555555; display: block; width: 24px; height: 24px; text-indent: 100%; white-space: nowrap; overflow: hidden; border-radius: 50%; }
  .toggle_title.selected .toggle_btn:before, .toggle_title.selected .toggle_btn:after { display: block; content: ''; background-color: #fff; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .toggle_contents dd { display: none; } }
