@charset "UTF-8";
@import url(https://fonts.googleapis.com/css2?family=Karla:wght@300;400;500;600&family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css);
/*スタイルリセット*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, figure { margin: 0; padding: 0; font-size: 100%; }

h1, h2, h3, h4, h5 { line-height: 1.2em; }

/* 変数
----------------------------------------------- */
body { font: 17px/1.8 "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; vertical-align: baseline; font-style: normal; letter-spacing: normal; color: #000000; background: #FFFFFF; }

@media (max-width: 544px) { body { font: 15px/1.7 "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; } }

a:link, a:visited, a:hover { color: #000000; text-decoration: none; }

.lg { display: none; }

@media (max-width: 992px) { .lg { display: block; } }

.md { display: none; }

@media (max-width: 768px) { .md { display: block; } }

.sm { display: none; }

@media (max-width: 544px) { .sm { display: block; } }

.content { width: 1200px; margin: 0 auto; padding: 0; }

@media (max-width: 992px) { .content { width: 96%; overflow-y: hidden; } }

.top-block-a { padding: 160px 0; }

.top-block-a h2 { font-family: "Karla", sans-serif; font-size: 3.0rem; color: #112969; letter-spacing: 0.01em; margin: 0 0 6rem 0; }

.top-block-a .content { position: relative; z-index: 3; }

@media (max-width: 544px) { .top-block-a h2 { margin: 0 0 3rem 0; } }

.block-b { padding: 160px 0; text-shadow: 0px 1px 2px #FFFFFF; }

.block-b h2 { font-family: "Karla", sans-serif; font-size: 3.0rem; color: #112969; letter-spacing: 0.01em; margin: 0 0 6rem 0; }

.block-b .content { position: relative; z-index: 3; }

main { min-height: calc(90vh - 60px); }

.btn-1 { text-align: center; margin: 3rem auto 1rem; }

.btn-1 a { background: #0057aa; color: #FFFFFF; text-decoration: none; font: 500 1rem "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; width: 300px; padding: 1rem 0.3em; display: inline-block; position: relative; text-shadow: none; }

.btn-1 a span { display: block; position: absolute; width: 200px; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.btn-1 a:hover { background: #39B1C7; }

@media (max-width: 544px) { .btn-1 a { max-width: 90%; } }

#triangle01 { width: 600px; height: 420px; background: rgba(194, 205, 214, 0.95); clip-path: polygon(70% 0%, 0% 100%, 100% 0%); position: fixed; top: -000px; right: 560px; z-index: 2; }

#triangle02 { width: 500px; height: 1000px; background: rgba(49, 84, 201, 0.95); clip-path: polygon(65% 0%, 0% 100%, 100% 0%); position: fixed; top: -000px; right: 160px; z-index: 2; }

@media (max-width: 544px) { #triangle02 { right: -30%; } }

#triangle03 { width: 300px; height: 1200px; background: rgba(49, 84, 201, 0.85); clip-path: polygon(0% 0%, 0% 37%, 100% 100%); position: absolute; top: 1500px; left: -60px; z-index: 2; }

.t-style01 { border-collapse: collapse; width: 90%; margin: 4.0rem auto; }

.t-style01 th, .t-style01 td { font-size: 1.0rem; font-weight: normal; padding: 1.6em 1em; border-bottom: 1px solid #C2CDD6; text-align: left; }

.t-style01 th { letter-spacing: 0.6em; }

@media (max-width: 544px) { .t-style01 { width: 98%; }
  .t-style01 th, .t-style01 td { display: block; }
  .t-style01 th { padding-bottom: 0.4em; border-bottom: none; }
  .t-style01 td { padding-top: 0.4em; padding-bottom: 1.2em; } }

header { padding: 18px 0; }

header .logo { position: relative; z-index: 3; }

header .logo img { width: 180px; height: auto; }

@media (max-width: 544px) { header .logo img { width: 120px; } }

header.top { height: calc(90vh - 36px); }

#hero .maincopy { font-family: "Karla", sans-serif; font-size: 100px; font-weight: 600; font-feature-settings: 'palt'; letter-spacing: -0.05em; line-height: 1.0em; color: #FFFFFF; margin-top: 15%; z-index: 3; position: relative; }

#hero #herobgvideo { position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: -1; width: 100%; height: 90vh; -o-object-fit: cover; object-fit: cover; background: url(/assets/img/hero_01.jpg); }

@media (max-width: 544px) { #hero .maincopy { font-size: 74px; } }

.top-cont { background: #FFFFFF; margin: 0 0 0 0; }

#top-service { background: #112969; color: #FFFFFF; }

#top-service h2 { color: #FFFFFF; }

#top-service .content { position: relative; z-index: 3; }

#top-service ul { display: flex; justify-content: space-between; list-style: none; }

#top-service ul li:first-child { width: 34%; }

#top-service ul li { width: 54%; padding: 0 6% 0 3%; }

#top-service ul li .service-logo { width: 280px; height: auto; }

#top-service ul li p { margin: 0 0 1em 0; }

@media (max-width: 544px) { #top-service ul { flex-wrap: wrap; }
  #top-service ul li { width: 94%; }
  #top-service ul li .service-logo { width: 180px; display: block; margin: auto; } }

#top-profile, #top-contact { text-shadow: 0px 1px 2px #FFFFFF; }

#top-profile { /*background: linear-gradient(135deg, #aebbd9 0%, #dff4ff 33%, #daeedf 100%);*/ background: linear-gradient(144deg, #aebbd9 0%, #e7f4f6 33%, #d3f2ea 66%, #fbfbfb 100%); background-size: 400% 500%; /*    background-size: 120% 120%;*/ animation: gradationAnim 10s ease infinite; }

@keyframes gradationAnim { 0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; } }

.form01 .focus01::placeholder { color: #C2CDD6; }

.form01 .require { font-size: 0.7rem; color: #FD5CBD; }

.form01 .caution { font-size: 0.8rem; }

input[type="text"], input[type="email"], textarea { width: 20.0em; padding: 0.6em 0.8em; border: none; border: 1px solid #C2CDD6; position: relative; background: #FFFFFF; }

@media (max-width: 544px) { input[type="text"], input[type="email"], textarea { max-width: 90%; width: 90%; } }

input[type="text"]:focus, input[type="email"]:focus, textarea:focus { border: 1px solid #112969; }

textarea { height: 8.0em; width: 30.0em; }

@media (max-width: 544px) { textarea { max-width: 90%; width: 90%; } }

input[type="submit"] { background: #0057aa; color: #FFFFFF; text-decoration: none; font: 500 1rem "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; width: 300px; padding: 1rem 0.3em; display: inline-block; position: relative; text-shadow: none; border: none; }

input[type="submit"]:hover { background: #39B1C7; cursor: pointer; }

@media (max-width: 544px) { input[type="submit"] { max-width: 90%; } }

.formError .formErrorContent { background: #FD5CBD; border: none; border-radius: inherit; box-shadow: none; }

.formError .formErrorArrow div { background: #FD5CBD; box-shadow: none; }

.optin-modal { background: #FBFBFB; padding: 1.4rem; text-align: center; position: fixed; left: 5%; top: 12px; z-index: 100; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); border: 1px solid rgba(194, 205, 214, 0); /*transform: translate(-50%, -00%);*/ font-size: 0.9rem; }

.optin-modal button { background: #FFFFFF; font-size: 0.9rem; border: 1px solid #C2CDD6; margin: 1em 0.5em 0; padding: 0.2em 1em; }

.optin-modal button:hover { background: #C2CDD6; cursor: pointer; }

.optin-modal button#cloudMessenger-iPhonePushRequest { background: #0057aa; color: #FFFFFF; }

.optin-modal .close { position: absolute; right: 0; top: 0; padding: 0.3em 0.6em; width: 100%; text-align: right; }

@media (max-width: 544px) { .optin-modal { width: calc(90% - 4.0rem); font-size: 0.96rem; left: 50%; bottom: 12px; top: auto; transform: translate(-50%, 0%); } }

.privacypolicy ul { margin: 1.2em 0 1.2em 2em; }

footer { background: #FFFFFF; padding: 48px 0 12px; text-align: center; font-size: 0.9rem; background: #112969; color: #FFFFFF; position: relative; z-index: 3; }

footer a:link, footer a:visited, footer a:hover { text-decoration: none; color: #FFFFFF; }

/*# sourceMappingURL=base.map */